<?xml version="1.0" encoding="utf-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
	<head>
		<title>tekUI Class Reference Manual</title>
		<link rel="stylesheet" href="manual.css" />
		<meta name="created" content="19-Sep-2016" />
	</head>
	<body>
		<h1>
			tekUI GUI Toolkit
		</h1>
		<p>
			Version 1.12
		</p>
		<hr />
		<div class="node"><h2><a name="ClassOverview" id="ClassOverview">Class Overview</a></h2>
			<blockquote>
				<ul>
					<li>
						<a href="#tek.class">Class</a> 
						<blockquote>
							<ul>
								<li>
									<a href="#tek.class.list">List</a> 
								</li>
								<li>
									<a href="#tek.class.markup">Markup</a> 
								</li>
								<li>
									<a href="#tek.class.object">Object</a> 
									<blockquote>
										<ul>
											<li>
												<a href="#tek.ui.class.element">Element</a> 
												<blockquote>
													<ul>
														<li>
															<a href="#tek.ui.class.area">Area</a> 
															<blockquote>
																<ul>
																	<li>
																		<a href="#tek.ui.class.frame">Frame</a> 
																		<blockquote>
																			<ul>
																				<li>
																					<a href="#tek.ui.class.canvas">Canvas</a> 
																				</li>
																				<li>
																					<a href="#tek.ui.class.floattext">FloatText</a> 
																				</li>
																				<li>
																					<a href="#tek.ui.class.spacer">Spacer</a> 
																				</li>
																				<li>
																					<a href="#tek.ui.class.widget">Widget</a> 
																					<blockquote>
																						<ul>
																							<li>
																								<a href="#tek.ui.class.group">Group</a> 
																								<blockquote>
																									<ul>
																										<li>
																											<a href="#tek.ui.class.dirlist">DirList</a> 
																										</li>
																										<li>
																											<a href="#tek.ui.class.listview">ListView</a> 
																										</li>
																										<li>
																											<a href="#tek.ui.class.pagegroup">PageGroup</a> 
																										</li>
																										<li>
																											<a href="#tek.ui.class.scrollbar">ScrollBar</a> 
																										</li>
																										<li>
																											<a href="#tek.ui.class.scrollgroup">ScrollGroup</a> 
																											<blockquote>
																												<ul>
																													<li>
																														<a href="#tek.ui.class.input">Input</a> 
																													</li>
																												</ul>
																											</blockquote>
																										</li>
																										<li>
																											<a href="#tek.ui.class.window">Window</a> 
																											<blockquote>
																												<ul>
																													<li>
																														<a href="#tek.ui.class.popupwindow">PopupWindow</a> 
																													</li>
																												</ul>
																											</blockquote>
																										</li>
																									</ul>
																								</blockquote>
																							</li>
																							<li>
																								<a href="#tek.ui.class.handle">Handle</a> 
																							</li>
																							<li>
																								<a href="#tek.ui.class.imagewidget">ImageWidget</a> 
																							</li>
																							<li>
																								<a href="#tek.ui.class.numeric">Numeric</a> 
																								<blockquote>
																									<ul>
																										<li>
																											<a href="#tek.ui.class.gauge">Gauge</a> 
																										</li>
																										<li>
																											<a href="#tek.ui.class.slider">Slider</a> 
																										</li>
																									</ul>
																								</blockquote>
																							</li>
																							<li>
																								<a href="#tek.ui.class.sizeable">Sizeable</a> 
																								<blockquote>
																									<ul>
																										<li>
																											<a href="#tek.ui.class.textedit">TextEdit</a> 
																										</li>
																									</ul>
																								</blockquote>
																							</li>
																							<li>
																								<a href="#tek.ui.class.text">Text</a> 
																								<blockquote>
																									<ul>
																										<li>
																											<a href="#tek.ui.class.button">Button</a> 
																										</li>
																										<li>
																											<a href="#tek.ui.class.checkmark">CheckMark</a> 
																											<blockquote>
																												<ul>
																													<li>
																														<a href="#tek.ui.class.radiobutton">RadioButton</a> 
																													</li>
																												</ul>
																											</blockquote>
																										</li>
																										<li>
																											<a href="#tek.ui.class.lister">Lister</a> 
																										</li>
																										<li>
																											<a href="#tek.ui.class.popitem">PopItem</a> 
																											<blockquote>
																												<ul>
																													<li>
																														<a href="#tek.ui.class.menuitem">MenuItem</a> 
																													</li>
																													<li>
																														<a href="#tek.ui.class.poplist">PopList</a> 
																													</li>
																												</ul>
																											</blockquote>
																										</li>
																									</ul>
																								</blockquote>
																							</li>
																						</ul>
																					</blockquote>
																				</li>
																			</ul>
																		</blockquote>
																	</li>
																</ul>
															</blockquote>
														</li>
														<li>
															<a href="#tek.ui.class.display">Display</a> 
														</li>
													</ul>
												</blockquote>
											</li>
											<li>
												<a href="#tek.ui.class.family">Family</a> 
												<blockquote>
													<ul>
														<li>
															<a href="#tek.ui.class.application">Application</a> 
														</li>
													</ul>
												</blockquote>
											</li>
										</ul>
									</blockquote>
								</li>
								<li>
									<a href="#tek.ui.class.layout">Layout</a> 
									<blockquote>
										<ul>
											<li>
												<a href="#tek.ui.layout.default">DefaultLayout</a> 
											</li>
											<li>
												<a href="#tek.ui.layout.fixed">FixedLayout</a> 
											</li>
										</ul>
									</blockquote>
								</li>
							</ul>
						</blockquote>
					</li>
				</ul>
			</blockquote>
			<h2>
				Libraries
			</h2>
			<blockquote>
				<ul>
					<li>
						<a href="#tek.lib.args">Args</a> 
					</li>
					<li>
						<a href="#tek.lib.debug">Debug</a> 
					</li>
					<li>
						<a href="#tek.lib.exec">Exec</a> 
					</li>
					<li>
						<a href="#tek.lib.region">Region</a> 
					</li>
					<li>
						<a href="#tek.lib.string">String</a> 
					</li>
					<li>
						<a href="#tek.lib.visual">Visual</a> 
					</li>
					<li>
						<a href="#tek.ui">ui</a> 
					</li>
				</ul>
			</blockquote>
			<hr class="page-break" />
		</div>
		<div class="node"><h2><a name="tek.class" id="tek.class">Class (v9.0)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> : Class / <select onchange="if (this.value != '') window.location.href = this.value; this.selectedIndex = 0;"><option value="">4 subclasses</option><option value="#tek.class.list">List</option><option value="#tek.class.markup">Markup</option><option value="#tek.class.object">Object</option><option value="#tek.ui.class.layout">Layout</option></select>
					</p>
					<p>
						This module implements inheritance and the creation of objects
						from classes.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>IMPLEMENTS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#object:getClass"><code>object:getClass()</code></a> - Returns the class of an object, or the super
							class of a class
						</li>
						<li style="list-style-type: none">
							<a href="#object:getClassName"><code>object:getClassName()</code></a> - Returns the class name of an object or class
						</li>
						<li style="list-style-type: none">
							<a href="#object:getSuper"><code>object:getSuper()</code></a> - Returns the super class of an object or class
						</li>
						<li style="list-style-type: none">
							<a href="#object:instanceOf"><code>object:instanceOf()</code></a> - Checks if an object descends from a class
						</li>
						<li style="list-style-type: none">
							<a href="#Class:module"><code>Class.module()</code></a> - Creates a new class from a superclass
						</li>
						<li style="list-style-type: none">
							<a href="#Class:new"><code>Class.new()</code></a> - Creates and returns a new object
						</li>
						<li style="list-style-type: none">
							<a href="#Class:newClass"><code>Class.newClass()</code></a> - Creates a child class from a super class
						</li>
						<li style="list-style-type: none">
							<a href="#object:setClass"><code>object:setClass()</code></a> - Changes the class of an object, or the super
							class of a class
						</li>
					</ul>
				</blockquote>
				<hr />
			</div>
		</div>
		<div class="node"><h3><a name="object:getClass" id="object:getClass"><code>class = object:getClass()</code></a></h3>
			<p>
				This function returns the class of an <code>object</code>. If applied to a
				class instead of an object, it returns its super class, e.g.:
			</p>
<pre>
superclass = Class.getClass(class)
</pre>
			<hr />
		</div>
		<div class="node"><h3><a name="object:getClassName" id="object:getClassName"><code>name = object:getClassName()</code></a></h3>
			<p>
				This function returns the <code>_NAME</code> 
				attribute of the <code>object</code>'s class. It is also possible to apply this
				function to a class instead of an object.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="object:getSuper" id="object:getSuper"><code>object:getSuper()</code></a></h3>
			<p>
				Gets the super class of an object or class.
				For example, to forward a call to a <code>method</code> to its super class,
				without knowing its class:
			</p>
<pre>
self:getSuper().method(self, ...)
</pre>
			<hr />
		</div>
		<div class="node"><h3><a name="object:instanceOf" id="object:instanceOf"><code>is_descendant = object:instanceOf(class)</code></a></h3>
			<p>
				Returns <strong>true</strong> if <code>object</code> is an instance of or descends from the
				specified <code>class</code>. It is also possible to apply this function to a class
				instead of an object, e.g.:
			</p>
<pre>
Class.instanceOf(Button, Area)
</pre>
			<hr />
		</div>
		<div class="node"><h3><a name="Class:module" id="Class:module"><code>class, superclass = Class.module(classname, superclassname)</code></a></h3>
			<p>
				Creates a new
				class from the specified superclass. <code>superclassname</code> is being loaded
				and its method <a href="#Class:newClass"><code>Class:newClass()</code></a> invoked with the <code>_NAME</code> field set to
				<code>classname</code>. Both class and superclass will be returned.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Class:new" id="Class:new"><code>object = Class.new(class[, object])</code></a></h3>
			<p>
				Creates and returns a new object of the given <code>class</code>. Optionally,
				it just prepares the specified <code>object</code> (a table) for inheritance and
				attaches the <code>class</code>' methods and data.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Class:newClass" id="Class:newClass"><code>class = Class.newClass(superclass[, class])</code></a></h3>
			<p>
				Derives a new class from the specified <code>superclass</code>. Optionally,
				an existing <code>class</code> (a table) can be specified. If a <code>_NAME</code> field
				exists in this class, it will be used. Otherwise, or if a new class is
				created, <code>class._NAME</code> will be composed from <code>superclass._NAME</code> and
				an unique identifier. The same functionality can be achieved by calling
				a class like a function, so the following invocations are equivalent:
			</p>
<pre>
class = Class.newClass(superclass)
class = superclass()
</pre>
			<p>
				The second notation allows a super class to be passed as the second
				argument to Lua's <code>module</code> function, which will set up a child class
				inheriting from <code>superclass</code> in the module table.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="object:setClass" id="object:setClass"><code>object:setClass(class)</code></a></h3>
			<p>
				Changes the class of an object
				or the super class of a class.
			</p>
			<hr class="page-break" />
		</div>
		<div class="node"><h2><a name="tek.class.list" id="tek.class.list">List (v3.2)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> :
						<a href="#tek.class">Class</a> / List 
					</p>
					<p>
						This class implements a list container.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>IMPLEMENTS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#List:addItem"><code>List:addItem()</code></a> - Adds an item to the list
						</li>
						<li style="list-style-type: none">
							<a href="#List:changeItem"><code>List:changeItem()</code></a> - Replaces an item in the list
						</li>
						<li style="list-style-type: none">
							<a href="#List:clear"><code>List:clear()</code></a> - Removes all items from the list
						</li>
						<li style="list-style-type: none">
							<a href="#List:getItem"><code>List:getItem()</code></a> - Returns the item at the specified position
						</li>
						<li style="list-style-type: none">
							<a href="#List:getN"><code>List:getN()</code></a> - Returns the number of items in the list
						</li>
						<li style="list-style-type: none">
							<a href="#List:remItem"><code>List:remItem()</code></a> - Removes an item from the list
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>ATTRIBUTES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<code>Items</code> &#091;I&#093; (table)
							<blockquote>
								<p>
									Table of initial list items, indexed numerically
								</p>
							</blockquote>
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>OVERRIDES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Class:new"><code>Class.new()</code></a> 
						</li>
					</ul>
				</blockquote>
				<hr />
			</div>
		</div>
		<div class="node"><h3><a name="List:addItem" id="List:addItem"><code>pos = List:addItem(entry[, pos])</code></a></h3>
			<p>
				Adds an item to the list, optionally
				inserting it at the specified position. Returns the position at which the
				item was added.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="List:changeItem" id="List:changeItem"><code>success = List:changeItem(entry, pos)</code></a></h3>
			<p>
				Changes the item at the specified
				position in the list. Returns <strong>true</strong> if an item was changed.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="List:clear" id="List:clear"><code>List:clear()</code></a></h3>
			<p>
				Removes all items from the list.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="List:getItem" id="List:getItem"><code>List:getItem(pos)</code></a></h3>
			<p>
				Returns the item at the specified position.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="List:getN" id="List:getN"><code>List:getN()</code></a></h3>
			<p>
				Returns the number of elements in the list.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="List:remItem" id="List:remItem"><code>entry = List:remItem(pos)</code></a></h3>
			<p>
				Removes an item at the specified position
				in the list. The item is returned to the caller.
			</p>
			<hr class="page-break" />
		</div>
		<div class="node"><h2><a name="tek.class.markup" id="tek.class.markup">Markup (v3.3)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> :
						<a href="#tek.class">Class</a> / Markup 
					</p>
					<p>
						This class implements a markup parser and converter for producing
						feature-rich XHTML 1.0 from plain text with special formattings.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>IMPLEMENTS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Markup:new"><code>Markup.new()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Markup:run"><code>Markup:run()</code></a> 
						</li>
					</ul>
				</blockquote>
				<hr />
			</div>
		</div>
		<div class="node"><h3><a name="Markup:new" id="Markup:new"><code>parser = Markup:new(args)</code></a></h3>
			<p>
				Creates a new markup parser. <code>args</code> can be a
				table of initial arguments that constitute its behavior. Supported fields
				in <code>args</code> are:
			</p>
			<table>
				<tr>
					<td class="column1">
						<code>indentchar</code> 
					</td>
					<td class="column2">
						Character recognized for indentation, default <code>&quot;\t&quot;</code> 
					</td>
				</tr>
				<tr>
					<td class="column1">
						<code>input</code> 
					</td>
					<td class="column2">
						Filehandle or string, default <code>io.stdin</code> 
					</td>
				</tr>
				<tr>
					<td class="column1">
						<code>rdfunc</code> 
					</td>
					<td class="column2">
						Line reader, by default reads using <code>args.input:lines</code> 
					</td>
				</tr>
				<tr>
					<td class="column1">
						<code>wrfunc</code> 
					</td>
					<td class="column2">
						Writer func, by default <code>io.stdout.write</code> 
					</td>
				</tr>
				<tr>
					<td class="column1">
						<code>docname</code> 
					</td>
					<td class="column2">
						Name of document, default <code>&quot;Manual&quot;</code> 
					</td>
				</tr>
				<tr>
					<td class="column1">
						<code>features</code> 
					</td>
					<td class="column2">
						Feature codes, default <code>&quot;hespcadlint&quot;</code> 
					</td>
				</tr>
			</table>
			<p>
				The parser supports the following features, which can be combined into
				a string and passed to the constructor in <code>args.features</code>:
			</p>
			<table>
				<tr>
					<td class="column1">
						Code
					</td>
					<td class="column2">
						Description
					</td>
					<td class="column3">
						rough HTML equivalent
					</td>
				</tr>
				<tr>
					<td class="column1">
						<code>h</code> 
					</td>
					<td class="column2">
						Heading
					</td>
					<td class="column3">
						<code>&lt;h1&gt;</code>, <code>&lt;h2&gt;</code>, ...
					</td>
				</tr>
				<tr>
					<td class="column1">
						<code>e</code> 
					</td>
					<td class="column2">
						Emphasis
					</td>
					<td class="column3">
						<code>&lt;strong&gt;</code> 
					</td>
				</tr>
				<tr>
					<td class="column1">
						<code>s</code> 
					</td>
					<td class="column2">
						Separator
					</td>
					<td class="column3">
						<code>&lt;hr&gt;</code> 
					</td>
				</tr>
				<tr>
					<td class="column1">
						<code>p</code> 
					</td>
					<td class="column2">
						Preformatted block
					</td>
					<td class="column3">
						<code>&lt;pre&gt;</code> 
					</td>
				</tr>
				<tr>
					<td class="column1">
						<code>c</code> 
					</td>
					<td class="column2">
						Code
					</td>
					<td class="column3">
						<code>&lt;code&gt;</code> 
					</td>
				</tr>
				<tr>
					<td class="column1">
						<code>a</code> 
					</td>
					<td class="column2">
						Anchor, link
					</td>
					<td class="column3">
						<code>&lt;a href=&quot;...&quot;&gt;</code> 
					</td>
				</tr>
				<tr>
					<td class="column1">
						<code>d</code> 
					</td>
					<td class="column2">
						Definition
					</td>
					<td class="column3">
						<code>&lt;dfn&gt;</code> 
					</td>
				</tr>
				<tr>
					<td class="column1">
						<code>l</code> 
					</td>
					<td class="column2">
						List
					</td>
					<td class="column3">
						<code>&lt;ul&gt;</code>, <code>&lt;li&gt;</code> 
					</td>
				</tr>
				<tr>
					<td class="column1">
						<code>i</code> 
					</td>
					<td class="column2">
						Image
					</td>
					<td class="column3">
						<code>&lt;img&gt;</code> 
					</td>
				</tr>
				<tr>
					<td class="column1">
						<code>n</code> 
					</td>
					<td class="column2">
						Node header
					</td>
					<td class="column3">
						<code>&lt;a name=&quot;...&quot;&gt;</code> 
					</td>
				</tr>
				<tr>
					<td class="column1">
						<code>t</code> 
					</td>
					<td class="column2">
						Table
					</td>
					<td class="column3">
						<code>&lt;table&gt;</code> 
					</td>
				</tr>
				<tr>
					<td class="column1">
						<code>f</code> 
					</td>
					<td class="column2">
						Function
					</td>
					<td class="column3">
						(undocumented, internal use only)
					</td>
				</tr>
			</table>
			<p>
				After creation of the parser, conversion starts by calling <a href="#Markup:run"><code>Markup:run()</code></a>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Markup:run" id="Markup:run"><code>run()</code></a></h3>
			<p>
				This function starts the conversion.
			</p>
			<hr class="page-break" />
		</div>
		<div class="node"><h2><a name="tek.class.object" id="tek.class.object">Object (v14.3)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> :
						<a href="#tek.class">Class</a> /
						Object / <select onchange="if (this.value != '') window.location.href = this.value; this.selectedIndex = 0;"><option value="">2 subclasses</option><option value="#tek.ui.class.element">Element</option><option value="#tek.ui.class.family">Family</option></select>
					</p>
					<p>
						This class implements notifications.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>IMPLEMENTS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Object:addClassNotifications"><code>Object.addClassNotifications()</code></a> - Collects class notifications
						</li>
						<li style="list-style-type: none">
							<a href="#Object:addNotify"><code>Object:addNotify()</code></a> - Adds a notification to an object
						</li>
						<li style="list-style-type: none">
							<a href="#Object:doNotify"><code>Object:doNotify()</code></a> - Invokes a notification in the addressed object
						</li>
						<li style="list-style-type: none">
							<a href="#Object:init"><code>Object.init()</code></a> - (Re-)initializes an object
						</li>
						<li style="list-style-type: none">
							<a href="#Object:remNotify"><code>Object:remNotify()</code></a> - Removes a notification from an object
						</li>
						<li style="list-style-type: none">
							<a href="#Object:setValue"><code>Object:setValue()</code></a> - Sets an attribute, triggering notifications
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>OVERRIDES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Class:new"><code>Class.new()</code></a> 
						</li>
					</ul>
				</blockquote>
				<hr />
			</div>
		</div>
		<div class="node"><h3><a name="Object:addClassNotifications" id="Object:addClassNotifications"><code>Object.addClassNotifications(proto)</code></a></h3>
			<p>
				class method for collecting the
				standard or default notifications of a class. These notifications
				remain in place, and are not removed or replaced during runtime.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Object:addNotify" id="Object:addNotify"><code>Object:addNotify(attr, val, dest)</code></a></h3>
			<p>
				Adds a notification to an object. <code>attr</code> is the name of an attribute to
				react on setting its value. <code>val</code> is the value that triggers the
				notification. For <code>val</code>, the placeholder <code>ui.NOTIFY_ALWAYS</code> can be
				used to react on any change of the value.
				<code>action</code> is a table describing the action to take when the
				notification occurs; it has the general form:
			</p>
<pre>
{ object, method, arg1, ... }
</pre>
			<p>
				<code>object</code> denotes the target of the notification, i.e. the <code>self</code> 
				that will be passed to the <code>method</code> as its first argument.
				<code>ui.NOTIFY_SELF</code> is a placeholder for the object causing the
				notification (see below for the additional placeholders <code>ui.NOTIFY_ID</code>,
				<code>ui.NOTIFY_WINDOW</code>, and <code>ui.NOTIFY_APPLICATION</code>). <code>method</code> can be
				either a string denoting the name of a function in the addressed object,
				or <code>ui.NOTIFY_FUNCTION</code> followed by a function value. The following
				placeholders are supported in the <a href="#tek.ui.class.object">Object</a> class:
			</p>
			<blockquote>
				<ul>
					<li>
						<code>ui.NOTIFY_SELF</code> - the object causing the notification
					</li>
					<li>
						<code>ui.NOTIFY_VALUE</code> - the value causing the notification
					</li>
					<li>
						<code>ui.NOTIFY_TOGGLE</code> - the logical negation of the value
					</li>
					<li>
						<code>ui.NOTIFY_OLDVALUE</code> - the attributes's value prior to setting it
					</li>
					<li>
						<code>ui.NOTIFY_FORMAT</code> - taking the next argument as a format string
						for formatting the value
					</li>
					<li>
						<code>ui.NOTIFY_FUNCTION</code> - to pass a function in the next argument
					</li>
				</ul>
			</blockquote>
			<p>
				The following additional placeholders are supported if the notification is
				triggered in a child of the <a href="#tek.ui.class.element">Element</a> class:
			</p>
			<blockquote>
				<ul>
					<li>
						<code>ui.NOTIFY_ID</code> - to address the <a href="#tek.ui.class.element">Element</a> 
						with the Id given in the next argument
					</li>
					<li>
						<code>ui.NOTIFY_WINDOW</code> - to address the
						<a href="#tek.ui.class.window">Window</a> the object is connected to
					</li>
					<li>
						<code>ui.NOTIFY_APPLICATION</code> - to address the
						<a href="#tek.ui.class.application">Application</a> the object is connected to
					</li>
					<li>
						<code>ui.NOTIFY_COROUTINE</code> - like <code>ui.NOTIFY_FUNCTION</code>, but the
						function will be launched as a coroutine by the
						<a href="#tek.ui.class.application">Application</a>. See also
						<a href="#Application:addCoroutine"><code>Application:addCoroutine()</code></a> for further details.
					</li>
				</ul>
			</blockquote>
			<p>
				In any case, the <code>method</code> will be invoked as follows:
			</p>
<pre>
method(object, arg1, ...)
</pre>
			<p>
				If the destination object or addressed method cannot be determined,
				nothing else besides setting the attribute will happen.
			</p>
			<p>
				Notifications should be removed using <a href="#Object:remNotify"><code>Object:remNotify()</code></a> when they are
				no longer needed, to reduce overhead and memory use.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Object:doNotify" id="Object:doNotify"><code>Object:doNotify(func, ...)</code></a></h3>
			<p>
				Performs a notification in the object by
				calling the specified function and passing it the given arguments. If
				<code>func</code> is a a function value, it will be called directly. Otherwise, it
				will be used as a key for looking up the function.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Object:init" id="Object:init"><code>object = Object.init(object)</code></a></h3>
			<p>
				This function is called during <a href="#Object:new"><code>Object.new()</code></a> 
				before passing control to <code>superclass.new()</code>. The original intention was
				that resources were to be claimed in <code>new()</code>, whereas defaults were to
				be (re-)initialized during <code>init()</code>. As of 1.04, this usage pattern is
				discouraged; all initializations should take place in <code>new()</code> now, as
				this differentiation was insufficient to cover complex reinitializations,
				and it interferes with fields like <code>Area.TrackDamage</code>, which are now
				initialization-only.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Object:remNotify" id="Object:remNotify"><code>success = Object:remNotify(attr, val, dest)</code></a></h3>
			<p>
				Removes a notification from an object and returns <strong>true</strong> if it
				was found and removed successfully. You must specify the exact set of
				arguments as for <a href="#Object:addNotify"><code>Object:addNotify()</code></a> to identify a notification for removal.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Object:setValue" id="Object:setValue"><code>Object:setValue(key, value[, notify])</code></a></h3>
			<p>
				Sets an <code>object</code>'s <code>key</code> to
				the specified <code>value</code>, and, if <code>notify</code> is not <strong>false</strong>, triggers
				notifications that were previously registered with the object. If
				<code>value</code> is <strong>nil</strong>, the key's present value is reset. To enforce a
				notification regardless of its value, set <code>notify</code> to <strong>true</strong>.
				For details on registering notifications, see <a href="#Object:addNotify"><code>Object:addNotify()</code></a>.
			</p>
			<hr class="page-break" />
		</div>
		<div class="node"><h2><a name="tek.lib.args" id="tek.lib.args">Args (v2.5)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						This library implements an argument parser.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>FORMAT DESCRIPTION</dfn>
				<blockquote>
					<p>
						A string is parsed into an array of arguments according to a format
						template. Arguments in the template are separated by commas. Each
						argument in the template consists of a keyword, optionally followed by
						one or more aliases delimited by equal signs, and an optional set of
						modifiers delimited by slashes. Modifiers denote the expected
						data type, if the argument is mandatory and whether a keyword must
						precede its value to form a valid argument. Example argument template:
					</p>
<pre>
SOURCE=-s/A/M,DEST=-d/A/K
</pre>
					<p>
						This template requires one or more arguments to satisfy <code>SOURCE</code>,
						and exactly one argument to satisfy <code>DEST</code>. Neither can be omitted.
						Either <code>-d</code> (or its alias <code>DEST</code>) must precede the value to be
						accepted as the second argument. Example command lines:
					</p>
					<table>
						<tr>
							<td class="column1">
								<code>SOURCE one two three DEST foo</code> 
							</td>
							<td class="column2">
								valid
							</td>
						</tr>
						<tr>
							<td class="column1">
								<code>DEST foo -s one</code> 
							</td>
							<td class="column2">
								valid
							</td>
						</tr>
						<tr>
							<td class="column1">
								<code>DEST foo</code> 
							</td>
							<td class="column2">
								rejected; source argument missing
							</td>
						</tr>
						<tr>
							<td class="column1">
								<code>one two three foo</code> 
							</td>
							<td class="column2">
								rejected; keyword missing
							</td>
						</tr>
						<tr>
							<td class="column1">
								<code>one two dest foo</code> 
							</td>
							<td class="column2">
								valid, keys are case insensitive
							</td>
						</tr>
						<tr>
							<td class="column1">
								<code>one two three -d=&quot;foo&quot; four</code> 
							</td>
							<td class="column2">
								valid, &quot;four&quot; added to <code>SOURCE</code> 
							</td>
						</tr>
					</table>
					<p>
						An option without modifiers represents an optional string argument.
						Available modifiers are:
					</p>
					<blockquote>
						<ul>
							<li>
								<code>/S</code> - <em>Switch</em>; considered a boolean value. When the
								keyword is present, <strong>true</strong> will be written into the
								respective slot in the results array.
							</li>
							<li>
								<code>/N</code> - <em>Number</em>; the value will be converted to a number.
							</li>
							<li>
								<code>/K</code> - <em>Keyword</em>; the keyword (or an alias) must precede its
								value.
							</li>
							<li>
								<code>/A</code> - <em>Always required</em>; This argument cannot be omitted.
							</li>
							<li>
								<code>/M</code> - <em>Multiple</em>; Any number of strings will be accepted,
								and all values that cannot be assigned to other arguments will
								show up in this argument. No more than one <code>/M</code> modifier may
								appear in a template.
							</li>
							<li>
								<code>/F</code> - <em>Fill</em>; literal rest of line. If present, this must
								be the last argument.
							</li>
						</ul>
					</blockquote>
					<p>
						Quoting and escaping: Double quotes can be used to enclose arguments
						containing equal signs and spaces.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>FUNCTIONS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#args:read"><code>args.read()</code></a> - Parses a string or table through an argument template
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>TODO</dfn>
				<blockquote>
					<p>
						Backslashes for escaping quotes, spaces and themselves
					</p>
				</blockquote>
				<hr />
			</div>
		</div>
		<div class="node"><h3><a name="args:read" id="args:read"><code>res, msg = args.read(template, args)</code></a></h3>
			<p>
				Parses <code>args</code> according to
				<code>template</code>. <code>args</code> can be a string or a table of strings. If the
				arguments can be successfully matched against the template, the result
				will be a table of parsed arguments, indexed by both keywords and
				numerical order in which they appear in <code>template</code>, and the second
				argument will be set to the number of arguments in the template. If the
				arguments cannot be matched against the template, the result will be
				<strong>nil</strong> followed by an error message.
			</p>
			<hr class="page-break" />
		</div>
		<div class="node"><h2><a name="tek.lib.debug" id="tek.lib.debug">Debug (v6.2)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						Debug library - implements debug output and debug levels:
					</p>
					<table>
						<tr>
							<td class="column1">
								2
							</td>
							<td class="column2">
								TRACE
							</td>
							<td class="column3">
								used for trace messages
							</td>
						</tr>
						<tr>
							<td class="column1">
								3
							</td>
							<td class="column2">
								INFO
							</td>
							<td class="column3">
								informational messages, notices
							</td>
						</tr>
						<tr>
							<td class="column1">
								4
							</td>
							<td class="column2">
								NOTE
							</td>
							<td class="column3">
								important notices
							</td>
						</tr>
						<tr>
							<td class="column1">
								5
							</td>
							<td class="column2">
								WARN
							</td>
							<td class="column3">
								something unexpected happened
							</td>
						</tr>
						<tr>
							<td class="column1">
								10
							</td>
							<td class="column2">
								ERROR
							</td>
							<td class="column3">
								something went wrong, e.g. resource unavailable
							</td>
						</tr>
						<tr>
							<td class="column1">
								20
							</td>
							<td class="column2">
								FAIL
							</td>
							<td class="column3">
								something went wrong that cannot be coped with
							</td>
						</tr>
					</table>
					<p>
						The default debug level is <code>WARN</code>. To set the debug level
						globally, e.g.:
					</p>
<pre>
db = require &quot;tek.lib.debug&quot;
db.level = db.INFO
</pre>
					<p>
						The default debug output stream is <code>stderr</code>.
						To override it globally, e.g.:
					</p>
<pre>
db = require &quot;tek.lib.debug&quot;
db.out = io.open(&quot;logfile&quot;, &quot;w&quot;)
</pre>
				</blockquote>
			</div>
			<div class="definition"><dfn>FUNCTIONS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#debug:console"><code>debug.console()</code></a> - Enters the debug console
						</li>
						<li style="list-style-type: none">
							<a href="#debug:dump"><code>debug.dump()</code></a> - Dumps a table recursively
						</li>
						<li style="list-style-type: none">
							<a href="#debug:error"><code>debug.error()</code></a> - Prints a text in the <code>ERROR</code> debug level
						</li>
						<li style="list-style-type: none">
							<a href="#debug:execute"><code>debug.execute()</code></a> - Executes a function in the specified debug level
						</li>
						<li style="list-style-type: none">
							<a href="#debug:fail"><code>debug.fail()</code></a> - Prints a text in the <code>FAIL</code> debug level
						</li>
						<li style="list-style-type: none">
							<a href="#debug:info"><code>debug.info()</code></a> - Prints a text in the <code>INFO</code> debug level
						</li>
						<li style="list-style-type: none">
							<a href="#debug:note"><code>debug.note()</code></a> - Prints a text in the <code>NOTE</code> debug level
						</li>
						<li style="list-style-type: none">
							<a href="#debug:print"><code>debug.print()</code></a> - Prints a text in the specified debug level
						</li>
						<li style="list-style-type: none">
							<a href="#debug:stacktrace"><code>debug.stacktrace()</code></a> - Prints a stacktrace in the specified debug level
						</li>
						<li style="list-style-type: none">
							<a href="#debug:trace"><code>debug.trace()</code></a> - Prints a text in the <code>TRACE</code> debug level
						</li>
						<li style="list-style-type: none">
							<a href="#debug:warn"><code>debug.warn()</code></a> - Prints a text in the <code>WARN</code> debug level
						</li>
						<li style="list-style-type: none">
							<a href="#debug:wrout"><code>debug.wrout()</code></a> - Output function
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>VALUES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<code>level</code> - Debug level, default 5 (<code>WARN</code>)
						</li>
						<li style="list-style-type: none">
							<code>out</code> - Output stream, default <code>io.stderr</code> 
						</li>
					</ul>
				</blockquote>
				<hr />
			</div>
		</div>
		<div class="node"><h3><a name="debug:console" id="debug:console"><code>debug.console()</code></a></h3>
			<p>
				Enters debug console.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="debug:dump" id="debug:dump"><code>debug.dump(table[, outfunc])</code></a></h3>
			<p>
				Dumps a table as Lua source using
				<code>outfunc</code>. Cyclic references are silently dropped. The default output
				function is <a href="#debug:wrout"><code>debug.wrout()</code></a>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="debug:error" id="debug:error"><code>debug.error(msg, ...)</code></a></h3>
			<p>
				Prints formatted debug info with <code>ERROR</code> debug
				level
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="debug:execute" id="debug:execute"><code>debug.execute(lvl, func, ...)</code></a></h3>
			<p>
				Executes the specified function if the
				global debug level is less or equal the specified level.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="debug:fail" id="debug:fail"><code>debug.fail(msg, ...)</code></a></h3>
			<p>
				Prints formatted debug info with <code>FAIL</code> debug level
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="debug:format" id="debug:format"><code>debug.format(lvl, msg, ...)</code></a></h3>
			<p>
				Format error message
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="debug:info" id="debug:info"><code>debug.info(msg, ...)</code></a></h3>
			<p>
				Prints formatted debug info with <code>INFO</code> debug level
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="debug:note" id="debug:note"><code>debug.note(msg, ...)</code></a></h3>
			<p>
				Prints formatted debug info with <code>NOTE</code> debug level
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="debug:print" id="debug:print"><code>debug.print(lvl, msg, ...)</code></a></h3>
			<p>
				Prints formatted text if the global debug level
				is less or equal the specified level.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="debug:stacktrace" id="debug:stacktrace"><code>debug.stacktrace(debuglevel[, stacklevel])</code></a></h3>
			<p>
				Prints a stacktrace starting at
				the function of the given level on the stack (excluding the
				<code>stracktrace</code> function itself) if the global debug level is less
				or equal the specified <code>debuglevel</code>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="debug:trace" id="debug:trace"><code>debug.trace(msg, ...)</code></a></h3>
			<p>
				Prints formatted debug info with <code>TRACE</code> debug
				level
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="debug:warn" id="debug:warn"><code>debug.warn(msg, ...)</code></a></h3>
			<p>
				Prints formatted debug info with <code>WARN</code> debug level
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="debug:wrout" id="debug:wrout"><code>debug.wrout(lvl, ...)</code></a></h3>
			<p>
				Debug output function, by default
			</p>
<pre>
function(...) out:write(...) end
</pre>
			<hr class="page-break" />
		</div>
		<div class="node"><h2><a name="tek.lib.exec" id="tek.lib.exec">Exec (v0.83)</a></h2>
			<div class="definition"><dfn>FUNCTIONS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Exec:getmsg"><code>Exec.getmsg()</code></a> - Get next message from own task's message queue
						</li>
						<li style="list-style-type: none">
							<a href="#Exec:getname"><code>Exec.getname()</code></a> - Get the own task's name
						</li>
						<li style="list-style-type: none">
							<a href="#Exec:getsignals"><code>Exec.getsignals()</code></a> - Get and clear own task's signals
						</li>
						<li style="list-style-type: none">
							<a href="#Exec:run"><code>Exec.run()</code></a> - Run a Lua function, file, or chunk, returning a task
						</li>
						<li style="list-style-type: none">
							<a href="#Exec:sendmsg"><code>Exec.sendmsg()</code></a> - Send a message to a named task
						</li>
						<li style="list-style-type: none">
							<a href="#Exec:sendport"><code>Exec.sendport()</code></a> - Send a message to a named task and port
						</li>
						<li style="list-style-type: none">
							<a href="#Exec:signal"><code>Exec.signal()</code></a> - Send signals to a named task
						</li>
						<li style="list-style-type: none">
							<a href="#Exec:sleep"><code>Exec.sleep()</code></a> - Suspend own task for a period of time
						</li>
						<li style="list-style-type: none">
							<a href="#Exec:wait"><code>Exec.wait()</code></a> - Suspend own task waiting for signals
						</li>
						<li style="list-style-type: none">
							<a href="#Exec:waitmsg"><code>Exec.waitmsg()</code></a> - Suspend own rask waiting for a message or timeout
						</li>
						<li style="list-style-type: none">
							<a href="#Exec:waittime"><code>Exec.waittime()</code></a> - Suspend own task waiting for signals and timeout
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>TASKS METHODS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#child:abort"><code>child:abort()</code></a> - Send abortion signal and wait for task completion
						</li>
						<li style="list-style-type: none">
							<a href="#child:join"><code>child:join()</code></a> - Wait for task completion
						</li>
						<li style="list-style-type: none">
							child:sendmsg(msg) - Send a message to a task, see <a href="#Exec:sendmsg"><code>Exec.sendmsg()</code></a> 
						</li>
						<li style="list-style-type: none">
							child:sendport(port, msg) - Send a message to a named port in the
							task, see <a href="#Exec:sendport"><code>Exec.sendport()</code></a> 
						</li>
						<li style="list-style-type: none">
							child:signal(&#091;sigs&#093;) - Send signals to a task, see <a href="#Exec:signal"><code>Exec.signal()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#child:terminate"><code>child:terminate()</code></a> - Send termination signal and wait for completion
							of a task
						</li>
					</ul>
				</blockquote>
				<hr />
			</div>
		</div>
		<div class="node"><h3><a name="child:abort" id="child:abort"><code>child:abort()</code></a></h3>
			<p>
				Sends the task the abortion signal <code>&quot;a&quot;</code> and synchronizes
				on its completion.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Exec:getmsg" id="Exec:getmsg"><code>msg, sender = Exec.getmsg()</code></a></h3>
			<p>
				Unlinks and returns the next message from the
				task's message queue, or <strong>nil</strong> if no messages are present. If a message
				is returned, then the second argument is the name of the task sending the
				message.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Exec:getname" id="Exec:getname"><code>name = Exec.getname()</code></a></h3>
			<p>
				Returns the own task's name.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Exec:getsignals" id="Exec:getsignals"><code>sig = Exec.getsignals([sigset])</code></a></h3>
			<p>
				Gets and clears the signals in <code>sigset</code> 
				from the own task's signal state, and returns the present signals, one
				character per signal, concatenated to a string. If no signals are present,
				returns <strong>nil</strong>. Possible signals and their meanings are
			</p>
			<blockquote>
				<ul>
					<li style="list-style-type: none">
						<code>&quot;a&quot;</code> - abort, the Lua program stops due to an error
					</li>
					<li style="list-style-type: none">
						<code>&quot;t&quot;</code> - terminate, the task is asked to quit
					</li>
					<li style="list-style-type: none">
						<code>&quot;c&quot;</code> - child, a child task has finished
					</li>
					<li style="list-style-type: none">
						<code>&quot;m&quot;</code> - message, a message is present at the task
					</li>
				</ul>
			</blockquote>
			<p>
				The default for <code>sigset</code> is <code>&quot;tcm&quot;</code>. Notes: The abortion signal cannot
				be cleared from a task. The termination signal is a request that a task
				may handle, but it is not enforced.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="child:join" id="child:join"><code>success, res1, ... = child:join()</code></a></h3>
			<p>
				Synchronizes the caller on completion
				of the child task. The first return value is boolean and indicative of
				whether the task completed successfully. While suspended in this function
				and if an error occurs in the child task, an error is propagated to the
				caller also, unless error propagation is suppressed - see <a href="#Exec:run"><code>Exec.run()</code></a>. If
				successful, return values from the child task will be converted to
				strings and returned as additional return values.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Exec:run" id="Exec:run"><code>child = Exec.run(what[, arg1[, ...]])</code></a></h3>
			<p>
				Tries to launch a Lua script,
				function, or chunk, and returns a handle on a child task if successful.
				The first argument can be a string denoting the filename of a Lua script,
				a Lua function, or a table. If a table is given, either of the following
				keys in the table is mandatory:
			</p>
			<blockquote>
				<ul>
					<li>
						<code>&quot;func&quot;</code>, a function value to run,
					</li>
					<li>
						<code>&quot;filename&quot;</code>, a string denoting the filename of a Lua script,
					</li>
					<li>
						<code>&quot;chunk&quot;</code>, a string value containing a Lua chunk to run.
					</li>
				</ul>
			</blockquote>
			<p>
				Optional keys in the table:
			</p>
			<blockquote>
				<ul>
					<li>
						<code>&quot;taskname&quot;</code>, a string denoting the name of the task to run.
						Task names are immutable during runtime and must be unique; the
						top-level task's implicit name is <code>&quot;main&quot;</code>.
					</li>
					<li>
						<code>&quot;abort&quot;</code>, a boolean to indicate whether errors in the child
						should be propagated to the parent task. Default: <strong>true</strong> 
					</li>
				</ul>
			</blockquote>
			<p>
				Additional arguments are passed to the script, in their given order.
				Methods on the returned child task handle:
			</p>
			<blockquote>
				<ul>
					<li>
						<a href="#child:abort"><code>child:abort()</code></a> - sends abortion signal and synchronizes on completion
						of the task
					</li>
					<li>
						<a href="#child:join"><code>child:join()</code></a> - synchronizes on completion of the task
					</li>
					<li>
						child:sendmsg(msg) - sends a message to a task, see <a href="#Exec:sendmsg"><code>Exec.sendmsg()</code></a> 
					</li>
					<li>
						child:sendport(port, msg) - Sends a message to a named port in
						the task, see <a href="#Exec:sendport"><code>Exec.sendport()</code></a> 
					</li>
					<li>
						child:signal(&#091;sigs&#093;) - sends signals to a task, see <a href="#Exec:signal"><code>Exec.signal()</code></a> 
					</li>
					<li>
						<a href="#child:terminate"><code>child:terminate()</code></a> - sends termination signal and synchronizes on
						completion of the task
					</li>
				</ul>
			</blockquote>
			<p>
				Note that the returned child handle is subject to garbage collection. If
				it gets collected (at the latest when the parent task is ending) and the
				child task is still running, the child will be sent the abortion signal,
				causing it to raise an error. This error, like any child error, also gets
				propagated back to the parent task, unless error propagation is suppressed
				(see above).
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Exec:sendmsg" id="Exec:sendmsg"><code>success = Exec.sendmsg(taskname, msg)</code></a></h3>
			<p>
				Sends a message to a named task.
				The special name <code>&quot;*p&quot;</code> addresses the parent task. Returns <strong>true</strong> 
				if the task was found and the message sent.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Exec:sendport" id="Exec:sendport"><code>success = Exec.sendport(taskname, portname, msg)</code></a></h3>
			<p>
				Sends the message to
				the named message port in the named task. Returns <strong>true</strong> if the task
				and port could be found and the message was sent.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Exec:signal" id="Exec:signal"><code>success = Exec.signal(taskname[, sigs])</code></a></h3>
			<p>
				Sends signals to a named task,
				by default the termination signal <code>&quot;t&quot;</code>. The special name <code>&quot;*p&quot;</code> 
				addresses the parent task. Returns <strong>true</strong> if the task was found and
				the signals sent. See <a href="#Exec:getsignals"><code>Exec.getsignals()</code></a> for details on the signal format.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Exec:sleep" id="Exec:sleep"><code>sig = Exec.sleep([millisecs])</code></a></h3>
			<p>
				Suspends the task for the given number of
				1/1000th seconds. If no timeout is specified, sleeps indefinitely. Returns
				<strong>nil</strong> when the timeout has expired, or <code>&quot;a&quot;</code> when an abortion signal
				occurred or was already present at the task.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="child:terminate" id="child:terminate"><code>success, res1, ... = child:terminate()</code></a></h3>
			<p>
				This function is equivalent to
				<a href="#child:join"><code>child:join()</code></a>, except for that it sends the child task the termination
				signal <code>&quot;t&quot;</code> before joining.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Exec:wait" id="Exec:wait"><code>sig = Exec.wait([sigset])</code></a></h3>
			<p>
				Suspends the task waiting for any signals from
				the specified set. The signals from <code>sigset</code> that occured (or were
				already present at the task) are returned to the caller - see
				<a href="#Exec:getsignals"><code>Exec.getsignals()</code></a> for their format. The default signal set to wait for is
				<code>&quot;tc&quot;</code>. Note: The abortion signal <code>&quot;a&quot;</code> is always included in the set.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Exec:waitmsg" id="Exec:waitmsg"><code>msg, sender, sig = Exec.waitmsg([millisecs])</code></a></h3>
			<p>
				Suspends the task waiting
				for the given number of 1/1000th seconds or for a message, and returns the
				next message to the caller. If no timeout is specified, waits indefinitely.
				Returns <strong>nil</strong> when no message arrives in the given time, or when the
				cause for returning was that only a signal showed up in the task. The
				second return value is the name of the sender task, see <a href="#Exec:getmsg"><code>Exec.getmsg()</code></a> for
				details. The third return value contains the possible signals (<code>&quot;m&quot;</code> 
				and <code>&quot;a&quot;</code>) that caused this function to return, or <strong>nil</strong> if a
				timeout occurred.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Exec:waittime" id="Exec:waittime"><code>sig = Exec.waittime(millisecs[, sigset])</code></a></h3>
			<p>
				Suspends the task waiting for
				the given number of 1/1000th seconds, or for any signals from the specified
				set. Signals from <code>sigset</code> that occured (or were already present at
				the task) are returned to the caller - see <a href="#Exec:getsignals"><code>Exec.getsignals()</code></a> for details.
				The default signal set to wait for is <code>&quot;tc&quot;</code>. Note: The abortion signal
				<code>&quot;a&quot;</code> is always included in the signal set.
			</p>
			<hr class="page-break" />
		</div>
		<div class="node"><h2><a name="tek.lib.region" id="tek.lib.region">Region (v11.3)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						This library implements the management of regions, which are
						collections of non-overlapping rectangles.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>FUNCTIONS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#region:andRect"><code>region:andRect()</code></a> - <em>And</em>s a rectangle to a region
						</li>
						<li style="list-style-type: none">
							<a href="#region:andRegion"><code>region:andRegion()</code></a> - <em>And</em>s a region to a region
						</li>
						<li style="list-style-type: none">
							<a href="#region:checkIntersect"><code>region:checkIntersect()</code></a> - Checks if a rectangle intersects a region
						</li>
						<li style="list-style-type: none">
							<a href="#region:forEach"><code>region:forEach()</code></a> - Calls a function for each rectangle in a region
						</li>
						<li style="list-style-type: none">
							<a href="#region:get"><code>region:get()</code></a> - Gets a region's min/max extents
						</li>
						<li style="list-style-type: none">
							<a href="#Region:intersect"><code>Region.intersect()</code></a> - Returns the intersection of two rectangles
						</li>
						<li style="list-style-type: none">
							<a href="#region:isEmpty"><code>region:isEmpty()</code></a> - Checks if a Region is empty
						</li>
						<li style="list-style-type: none">
							<a href="#Region:new"><code>Region.new()</code></a> - Creates a new Region
						</li>
						<li style="list-style-type: none">
							<a href="#region:orRect"><code>region:orRect()</code></a> - <em>Or</em>s a rectangle to a region
						</li>
						<li style="list-style-type: none">
							<a href="#region:orRegion"><code>region:orRegion()</code></a> - <em>Or</em>s a region to a region
						</li>
						<li style="list-style-type: none">
							<a href="#region:setRect"><code>region:setRect()</code></a> - Resets a region to the given rectangle
						</li>
						<li style="list-style-type: none">
							<a href="#region:shift"><code>region:shift()</code></a> - Displaces a region
						</li>
						<li style="list-style-type: none">
							<a href="#region:subRect"><code>region:subRect()</code></a> - Subtracts a rectangle from a region
						</li>
						<li style="list-style-type: none">
							<a href="#region:subRegion"><code>region:subRegion()</code></a> - Subtracts a region from a region
						</li>
						<li style="list-style-type: none">
							<a href="#region:xorRect"><code>region:xorRect()</code></a> - <em>Exclusive Or</em>s a rectangle to a region
						</li>
					</ul>
				</blockquote>
				<hr />
			</div>
		</div>
		<div class="node"><h3><a name="region:andRect" id="region:andRect"><code>region:andRect(r1, r2, r3, r4)</code></a></h3>
			<p>
				Logical <em>and</em>s a rectange to a region
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="region:andRegion" id="region:andRegion"><code>region:andRegion(r)</code></a></h3>
			<p>
				Logically <em>and</em>s a region to a region
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="region:checkIntersect" id="region:checkIntersect"><code>success = region:checkIntersect(x0, y0, x1, y1)</code></a></h3>
			<p>
				Returns a boolean
				indicating whether a rectangle specified by its coordinates overlaps
				with a region.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="region:forEach" id="region:forEach"><code>region:forEach(func, obj, ...)</code></a></h3>
			<p>
				For each rectangle in a region, calls the
				specified function according the following scheme:
			</p>
<pre>
func(obj, x0, y0, x1, y1, ...)
</pre>
			<p>
				Extra arguments are passed through to the function.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="region:get" id="region:get"><code>minx, miny, maxx, maxy = region:get()</code></a></h3>
			<p>
				Get region's min/max extents
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Region:intersect" id="Region:intersect"><code>x0, y0, x1, y1 = Region.intersect(d1, d2, d3, d4, s1, s2, s3, s4)</code></a></h3>
			<p>
				Returns the coordinates of a rectangle where a rectangle specified by
				the coordinates s1, s2, s3, s4 overlaps with the rectangle specified
				by the coordinates d1, d2, d3, d4. The return value is <strong>nil</strong> if
				the rectangles do not overlap.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="region:isEmpty" id="region:isEmpty"><code>region:isEmpty()</code></a></h3>
			<p>
				Returns <strong>true</strong> if a region is empty.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Region:new" id="Region:new"><code>region = Region.new(r1, r2, r3, r4)</code></a></h3>
			<p>
				Creates a new region from the given
				coordinates.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="region:orRect" id="region:orRect"><code>region:orRect(r1, r2, r3, r4)</code></a></h3>
			<p>
				Logical <em>or</em>s a rectangle to a region
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="region:orRegion" id="region:orRegion"><code>region:orRegion(r)</code></a></h3>
			<p>
				Logically <em>or</em>s a region to a region
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="region:setRect" id="region:setRect"><code>self = region:setRect(r1, r2, r3, r4)</code></a></h3>
			<p>
				Resets an existing region
				to the specified rectangle.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="region:shift" id="region:shift"><code>region:shift(dx, dy)</code></a></h3>
			<p>
				Shifts a region by delta x and y.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="region:subRect" id="region:subRect"><code>self = region:subRect(r1, r2, r3, r4)</code></a></h3>
			<p>
				Subtracts a rectangle from a region
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="region:subRegion" id="region:subRegion"><code>region:subRegion(region2)</code></a></h3>
			<p>
				Subtracts <code>region2</code> from <code>region</code>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="region:xorRect" id="region:xorRect"><code>region:xorRect(r1, r2, r3, r4)</code></a></h3>
			<p>
				Logical <em>xor</em>s a rectange to a region
			</p>
			<hr class="page-break" />
		</div>
		<div class="node"><h2><a name="tek.lib.string" id="tek.lib.string">String (v2.0)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						String management supporting two 31 bit values for each codepoint
						(intended for character strings and their metadata). Strings are
						stored internally as UTF-8 encoded snippets which are automatically
						packed and unpacked on demand. Forward iteration, insertion and
						deletion is considered fast, even for strings of arbitrary length
						and at arbitrary positions.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>FUNCTIONS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#String:attachdata"><code>String:attachdata()</code></a> - Attach a Lua value to a string
						</li>
						<li style="list-style-type: none">
							<a href="#String:encodeutf8"><code>String.encodeutf8()</code></a> - Encode codepoints to UTF-8
						</li>
						<li style="list-style-type: none">
							<a href="#String:erase"><code>String:erase()</code></a> - Erases a range of a string
						</li>
						<li style="list-style-type: none">
							<a href="#String:find"><code>String:find()</code></a> - Finds the UTF-8 string in a string object
						</li>
						<li style="list-style-type: none">
							<a href="#String:foreachutf8"><code>String.foreachutf8()</code></a> - Iterate codepoints of an UTF-8 encoded string
						</li>
						<li style="list-style-type: none">
							<a href="#String:free"><code>String:free()</code></a> - Reset string object, free associated data
						</li>
						<li style="list-style-type: none">
							<a href="#String:get"><code>String:get()</code></a> - Returns string
						</li>
						<li style="list-style-type: none">
							<a href="#String:getchar"><code>String:getchar()</code></a> - Returns character UTF-8 encoded
						</li>
						<li style="list-style-type: none">
							<a href="#String:getdata"><code>String:getdata()</code></a> - Retrieves Lua value associated with a string
						</li>
						<li style="list-style-type: none">
							<a href="#String:getval"><code>String:getval()</code></a> - Returns character and metadata
						</li>
						<li style="list-style-type: none">
							<a href="#String:insert"><code>String:insert()</code></a> - Appends or inserts string
						</li>
						<li style="list-style-type: none">
							<a href="#String:len"><code>String:len()</code></a> - Returns string length
						</li>
						<li style="list-style-type: none">
							<a href="#String:new"><code>String.new()</code></a> - Creates a new string object
						</li>
						<li style="list-style-type: none">
							<a href="#String:overwrite"><code>String:overwrite()</code></a> - Overwrites range of a string
						</li>
						<li style="list-style-type: none">
							<a href="#String:set"><code>String:set()</code></a> - Initializes string object
						</li>
						<li style="list-style-type: none">
							<a href="#String:setmetadata"><code>String:setmetadata()</code></a> - Set metadata in a string object
						</li>
						<li style="list-style-type: none">
							<a href="#String:sub"><code>String:sub()</code></a> - Returns substring
						</li>
					</ul>
				</blockquote>
				<hr />
			</div>
		</div>
		<div class="node"><h3><a name="String:erase" id="String:erase"><code>String:erase([p0[, p1]])</code></a></h3>
			<p>
				Erases a range of characters from a string
				object. An optional range starts at position <code>p0</code> and extends to the
				position <code>p1</code>, which may be negative to indicate the number of
				characters from the end of the string.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="String:find" id="String:find"><code>p0, p1 = String:find(utf8[, pos])</code></a></h3>
			<p>
				Finds the specified UTF-8 encoded
				string in the string object, and if found, returns the first and last
				position of its next occurrence from the starting position
				(default: <code>1</code>).
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="String:foreachutf8" id="String:foreachutf8"><code>length, maxval = String.foreachutf8(utf8string[, arg])</code></a></h3>
			<p>
				Returns the number of codepoints in <code>utf8string</code> and the highest
				codepoint number that occured in the string.
				<code>arg</code> can be a table, in which case each codepoint will be inserted
				into it as a number value, or a function, which will be called for each
				codepoint as its first, and the current position as its second argument.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="String:free" id="String:free"><code>String:free()</code></a></h3>
			<p>
				Free resources held by a string object
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="String:get" id="String:get"><code>utf8str = String:get([p0[, p1]])</code></a></h3>
			<p>
				An alias for <a href="#String:sub"><code>String:sub()</code></a> 
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="String:getchar" id="String:getchar"><code>utf8 = String:getchar(pos)</code></a></h3>
			<p>
				Returns an UTF-8 encoded character at the
				given position in a string object.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="String:getval" id="String:getval"><code>char, metadata = String:getval(pos)</code></a></h3>
			<p>
				Returns a character's and its
				metadata's numeric codepoints at the given position in a string object.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="String:insert" id="String:insert"><code>String:insert(string2[, pos])</code></a></h3>
			<p>
				Inserts <code>string2</code> into the string
				object, optionally at the given starting position. The default position
				is at the end of the string. <code>string2</code> may be an UTF-8 encoded string or
				another string object. Metadata from another string object will be
				inserted accordingly, otherwise it is set to <code>0</code>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="String:len" id="String:len"><code>len = String:len()</code></a></h3>
			<p>
				Returns the number of characters in the string object.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="String:new" id="String:new"><code>string = String.new()</code></a></h3>
			<p>
				Creates a new, initially empty string object.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="String:overwrite" id="String:overwrite"><code>String:overwrite(utf8str[, pos])</code></a></h3>
			<p>
				Overwrites a range of characters in a
				string object from an UTF-8 encoded string, starting at the given position
				(default: <code>1</code>). Metadata in the string object at the affected positions
				will be set to <code>0</code>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="String:set" id="String:set"><code>string = String:set(string2[, p0[, p1]])</code></a></h3>
			<p>
				Initializes the string
				object with <code>string2</code>, which can be either an UTF-8
				encoded string or another string object. An optional range starts at
				position <code>p0</code> and extends to the position <code>p1</code>, which may be negative
				to indicate the number of characters from the end of the string.
				Metadata at the affected positions is set to <code>0</code>. Returns itself.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="String:setmetadata" id="String:setmetadata"><code>String:setmetadata(value[, p0[, p1]])</code></a></h3>
			<p>
				Sets metadata in a string object
				to the specified value. An optional range starts at position <code>p0</code> and
				extends to the position <code>p1</code>, which may be negative to indicate the
				number of characters from the end of the string.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="String:sub" id="String:sub"><code>utf8str = String:sub([p0[, p1]])</code></a></h3>
			<p>
				Returns an UTF-8 encoded string
				representing the string object or a range of it. An optional range starts
				at position <code>p0</code> and extends to the position <code>p1</code>, which may be
				negative to indicate the number of characters from the end of the string.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="String:utf8encode" id="String:utf8encode"><code>utf8string = String.utf8encode(table or number[, ...])</code></a></h3>
			<p>
				If the first
				argument is a table, encodes the numerically indexed codepoints in that
				table to an UTF-8 string; an optional second argument specifies the
				first position and an optional third argument the last position in the
				table.
				If the first argument is a number, encodes this and the following
				arguments as codepoints to an UTF-8 string.
			</p>
			<hr class="page-break" />
		</div>
		<div class="node"><h2><a name="tek.lib.visual" id="tek.lib.visual">Visual (v1.2)</a></h2>
			<div class="definition"><dfn>FUNCTIONS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Visual:allocPen"><code>Visual:allocPen()</code></a> - Obtain a colored pen
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:blitRect"><code>Visual:blitRect()</code></a> - Move rectangular area
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:clearInput"><code>Visual:clearInput()</code></a> - Remove input sources
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:close"><code>Visual.close()</code></a> - Close a visual
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:closeFont"><code>Visual.closeFont()</code></a> - Close font
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:createGradient"><code>Visual.createGradient()</code></a> - Create gradient
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:createPixmap"><code>Visual.createPixmap()</code></a> - Create pixmap from file or table
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:drawImage"><code>Visual:drawImage()</code></a> - Draw simple vector image
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:drawLine"><code>Visual:drawLine()</code></a> - Draw line
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:drawPixmap"><code>Visual:drawPixmap()</code></a> - Draw pixmap
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:drawPoint"><code>Visual:drawPoint()</code></a> - Draw pixel
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:drawRect"><code>Visual:drawRect()</code></a> - Draw rectangle
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:drawRGB"><code>Visual:drawRGB()</code></a> - Draw table as RGB
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:drawText"><code>Visual:drawText()</code></a> - Draw text
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:fillRect"><code>Visual:fillRect()</code></a> - Fill rectangle
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:flush"><code>Visual:flush()</code></a> - Flush changes to display
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:freePen"><code>Visual:freePen()</code></a> - Release a colored pen
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:getAttrs"><code>Visual:getAttrs()</code></a> - Retrieve attributes from a visual
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:getClipRect"><code>Visual:getClipRect()</code></a> - Get active clipping rectangle
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:getDisplayAttrs"><code>Visual.getDisplayAttrs()</code></a> - Get attributes from the display
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:getFontAttrs"><code>Visual.getFontAttrs()</code></a> - Get font attributes
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:getMsg"><code>Visual.getMsg()</code></a> - Get next input message
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:getPaintInfo"><code>Visual:getPaintInfo()</code></a> - Get type of the background paint
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:getTextSize"><code>Visual.getTextSize()</code></a> - Get size of a text when rendered with a font
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:getTime"><code>Visual.getTime()</code></a> - Get system time
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:getUserdata"><code>Visual:getUserdata()</code></a> - Get a visual's userdata
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:open"><code>Visual.open()</code></a> - Open a visual
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:openFont"><code>Visual.openFont()</code></a> - Open a font
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:popClipRect"><code>Visual:popClipRect()</code></a> - Pop rectangle from stack of clip rects
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:pushClipRect"><code>Visual:pushClipRect()</code></a> - Push rectangle on stack of clip rects
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:setAttrs"><code>Visual:setAttrs()</code></a> - Set attributes in visual
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:setBGPen"><code>Visual:setBGPen()</code></a> - Set visual's background pen, pixmap or gradient
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:setClipRect"><code>Visual:setClipRect()</code></a> - Set clipping rectangle
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:setFont"><code>Visual:setFont()</code></a> - Set the visual's current font
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:setInput"><code>Visual:setInput()</code></a> - Add input sources
						</li>
						<li style="list-style-type: none">
							<a href="#Visuak:getSelection"><code>Visuak:getSelection()</code></a> - Get visual's selection or clipboard
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:setSelection"><code>Visual:setSelection()</code></a> - Set visual's selection or clipboard
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:setShift"><code>Visual:setShift()</code></a> - Set coordinate displacement
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:setTextureOrigin"><code>Visual:setTextureOrigin()</code></a> - Set texture origin
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:sleep"><code>Visual.sleep()</code></a> - Wait for number of milliseconds
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:textSize"><code>Visual:textSize()</code></a> - Get size of text when rendered with current font
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:unsetClipRect"><code>Visual:unsetClipRect()</code></a> - Unset clipping rectangle
						</li>
						<li style="list-style-type: none">
							<a href="#Visual:wait"><code>Visual.wait()</code></a> - Wait for any event from any window
						</li>
					</ul>
				</blockquote>
				<hr />
			</div>
		</div>
		<div class="node"><h3><a name="Visual:allocPen" id="Visual:allocPen"><code>pen = Visual:allocPen(a, r, g, b)</code></a></h3>
			<p>
				Obtain a colored pen.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:blitRect" id="Visual:blitRect"><code>Visual:blitRect(x0, y0, x1, y1, dx, dy[, exposetable])</code></a></h3>
			<p>
				Blits the given
				rectangle to the destination upper left position <code>dx</code>/<code>dy</code>. Source
				areas of the blit that were previously obscured but are getting exposed by
				blitting them into visibility show up as coordinate quartets (x0, y0, x1,
				y1 each) in the optional <code>exposetable</code>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:clearInput" id="Visual:clearInput"><code>Visual:clearInput(inputmask)</code></a></h3>
			<p>
				For a visual, specifies a set of input
				message types the caller wishes to remove from the set of messages to be
				received. For the valid types, see <a href="#Visual:getMsg"><code>Visual.getMsg()</code></a>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:close" id="Visual:close"><code>Visual.close()</code></a></h3>
			<p>
				Close visual.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:closeFont" id="Visual:closeFont"><code>Visual.closeFont(font)</code></a></h3>
			<p>
				Free font and associated resources.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:createGradient" id="Visual:createGradient"><code>gradient = Visual.createGradient(x0, y0, x1, y1, rgb0, rgb1)</code></a></h3>
			<p>
				If gradient
				support is available, creates a gradient object with a gradient from the
				coordinates x0,y0, with the color rgb0 to x1,y1, with the color rgb1.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:createPixmap" id="Visual:createPixmap"><code>pixmap = Visual.createPixmap(src[, width[, height[, alpha[, idx]]]])</code></a></h3>
			<p>
				Creates a pixmap object from some source. The <code>src</code> argument can be a
				string, containing a loaded image in some file format (PPM or PNG), an open
				file, or a table. In case of a string or a file, width and height determine
				an optional size to scale the image to. If only one of width and height are
				given, the image is scaled proprtionally. In case of a table, the width and
				height arguments are mandatory, and the table is expected to contain RGB
				values starting at table index <code>0</code>, unless another index is given.
				The <code>alpha</code> argument can be used to override presence or absence of an
				alpha channel; the default is determined by the picture, or none in the
				case of a table source.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:drawImage" id="Visual:drawImage"><code>Visual:drawImage(table, x0, y0, x1, y1, pen_or_pentab)</code></a></h3>
			<p>
				Draw a table
				containing a simple vector image into the specified rectangle, with the
				specified table of pens, or a single pen. Image table format:
			</p>
<pre>
{
  &#091;1&#093; = { x0, y0, x1, y1, ... }, -- coordinates table
  &#091;4&#093; = boolean, -- is_transparent
  &#091;5&#093; = { -- table of primitive records
    { &#091;1&#093;=fmtcode, &#091;2&#093;=nmpts, &#091;3&#093;={ indices }, &#091;4&#093;=pen_or_table },
    ...
  }
}
</pre>
			<p>
				<code>fmtcode</code> can be <code>0x1000</code> for a strip, <code>0x2000</code> for a fan.
				The coordinates are in the range from 0 to 0xffff.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:drawLine" id="Visual:drawLine"><code>Visual:drawLine(x0, y0, x1, y1, pen)</code></a></h3>
			<p>
				Draw a line.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:drawPixmap" id="Visual:drawPixmap"><code>Visual:drawPixmap(pm, x0, y0, x1, y1)</code></a></h3>
			<p>
				Draw pixmap.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:drawPoint" id="Visual:drawPoint"><code>Visual:drawPoint(x, y, pen)</code></a></h3>
			<p>
				Draw a pixel.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:drawRGB" id="Visual:drawRGB"><code>Visual:drawRGB(table, x, y, w, h[, pw[, ph[, has_alpha[, x0]]])</code></a></h3>
			<p>
				Draw a
				table of RGB values as pixels. The table starts at index <code>x0</code>, default
				<code>0</code>. <code>pw</code> and <code>ph</code> are the &quot;thickness&quot; of pixels, whih allows to
				stretch the output by the given factor. The default is <code>1</code> respectively.
				The boolean <code>has_alpha</code> determines whether the pixel values are to be
				interpreted as ARGB and be rendered with alpha channel.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:drawRect" id="Visual:drawRect"><code>Visual:drawRect(x0, y0, x1, y1, pen)</code></a></h3>
			<p>
				Draw a rectangle
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:drawText" id="Visual:drawText"><code>Visual:drawText(x0, y0, x1, y1, text, fgpen[, bgpaint])</code></a></h3>
			<p>
				Draw the text into
				the specified rectangle. <code>fgpen</code> must be a pen, bgpaint is optional and
				may be a pen, a pixmap, or a gradient. For drawing background with a pixmap
				or gradient, see also <a href="#Visual:setTextureOrigin"><code>Visual:setTextureOrigin()</code></a>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:fillRect" id="Visual:fillRect"><code>Visual:fillRect(x0, y0, x1, y1[, paint])</code></a></h3>
			<p>
				Draw a filled rectangle.
				<code>paint</code> may refer to a pen, a pixmap, or a gradient. For drawing with
				a pixmap or gradient, see also <a href="#Visual:setTextureOrigin"><code>Visual:setTextureOrigin()</code></a>. If no paint
				argument is specified, the visual's current background paint is used,
				see also <a href="#Visual:setBGPen"><code>Visual:setBGPen()</code></a>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:flush" id="Visual:flush"><code>Visual:flush()</code></a></h3>
			<p>
				Flush all changes to the visual to the display.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:freePen" id="Visual:freePen"><code>Visual:freePen(pen)</code></a></h3>
			<p>
				Release a colored pen
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:getAttrs" id="Visual:getAttrs"><code>attr1, ... = Visual:getAttrs(attributes)</code></a></h3>
			<p>
				Retrieve attributes from a
				visual. <code>attributes</code> is a string, in which individual characters
				determine a property each, which are returned in the order of their
				occurrence. Default: <code>&quot;whxy&quot;</code>. Attributes:
			</p>
			<blockquote>
				<ul>
					<li style="list-style-type: none">
						<code>&quot;w&quot;</code> - number, visual's width in pixels
					</li>
					<li style="list-style-type: none">
						<code>&quot;h&quot;</code> - number, visual's height in pixels
					</li>
					<li style="list-style-type: none">
						<code>&quot;W&quot;</code> - number, screen width in pixels
					</li>
					<li style="list-style-type: none">
						<code>&quot;H&quot;</code> - number, screen height in pixels
					</li>
					<li style="list-style-type: none">
						<code>&quot;x&quot;</code> - number, visual's left edge on the screen
					</li>
					<li style="list-style-type: none">
						<code>&quot;y&quot;</code> - number, visual's top edge on the screen
					</li>
					<li style="list-style-type: none">
						<code>&quot;s&quot;</code> - boolean, whether the visual has a selection
					</li>
					<li style="list-style-type: none">
						<code>&quot;c&quot;</code> - boolean, whether the visual has a clipboard
					</li>
					<li style="list-style-type: none">
						<code>&quot;M&quot;</code> - boolean, whether the screen has a window manager
					</li>
				</ul>
			</blockquote>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:getClipRect" id="Visual:getClipRect"><code>x0, y0, x1, y1 = Visual:getClipRect()</code></a></h3>
			<p>
				Get the visual's clipping rectangle
				that is in effect currently.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:getDisplayAttrs" id="Visual:getDisplayAttrs"><code>attr1, ... = Visual.getDisplayAttrs(attrs)</code></a></h3>
			<p>
				Queries attributes from the
				display. Returns one value for each character specified in the <code>attrs</code> 
				string. Attributes:
			</p>
			<blockquote>
				<ul>
					<li style="list-style-type: none">
						<code>&quot;M&quot;</code> - The display provides a window manager (boolean)
					</li>
				</ul>
			</blockquote>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:getFontAttrs" id="Visual:getFontAttrs"><code>table = Visual.getFontAttrs(font[, table])</code></a></h3>
			<p>
				Returns font attributes in
				a table. Field keys as currently defined:
			</p>
			<blockquote>
				<ul>
					<li style="list-style-type: none">
						<code>&quot;Height&quot;</code> - Height in pixels
					</li>
					<li style="list-style-type: none">
						<code>&quot;UlPosition&quot;</code> - Position of an underline, in pixels
					</li>
					<li style="list-style-type: none">
						<code>&quot;UlThickness&quot;</code> - Thickness of an underline, in pixels
					</li>
				</ul>
			</blockquote>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:getMsg" id="Visual:getMsg"><code>msg = Visual.getMsg()</code></a></h3>
			<p>
				Get next input message. Fields in a message are
				indexed numerically:
			</p>
			<blockquote>
				<ul>
					<li style="list-style-type: none">
						<code>-1</code> - Userdata, e.g. the window object from which the message
						originates, or the user message body in case of <code>ui.MSG_USER</code> 
					</li>
					<li style="list-style-type: none">
						<code>0</code> - Timestamp of the message, milliseconds
					</li>
					<li style="list-style-type: none">
						<code>1</code> - Timestamp of the message, seconds
					</li>
					<li style="list-style-type: none">
						<code>2</code> - Message type. Types:
						<blockquote>
							<ul>
								<li style="list-style-type: none">
									<code>ui.MSG_CLOSE</code> - the user wishes to close the window
								</li>
								<li style="list-style-type: none">
									<code>ui.MSG_FOCUS</code> - the window received/lost the input focus
								</li>
								<li style="list-style-type: none">
									<code>ui.MSG_NEWSIZE</code> - the window has been resized
								</li>
								<li style="list-style-type: none">
									<code>ui.MSG_REFRESH</code> - a part of the window needs a repaint
								</li>
								<li style="list-style-type: none">
									<code>ui.MSG_MOUSEOVER</code> - the mouse moved over/out of the window
								</li>
								<li style="list-style-type: none">
									<code>ui.MSG_KEYDOWN</code> - a key was pressed down
								</li>
								<li style="list-style-type: none">
									<code>ui.MSG_MOUSEMOVE</code> - the mouse was moved
								</li>
								<li style="list-style-type: none">
									<code>ui.MSG_MOUSEBUTTON</code> - a mouse button was pressed
								</li>
								<li style="list-style-type: none">
									<code>ui.MSG_INTERVAL</code> - a timer interval has passed
								</li>
								<li style="list-style-type: none">
									<code>ui.MSG_KEYUP</code> - a key was released
								</li>
								<li style="list-style-type: none">
									<code>ui.MSG_USER</code> - a user message was send to the application
								</li>
								<li style="list-style-type: none">
									<code>ui.MSG_REQSELECTION</code> - selection or clipboard requested
								</li>
							</ul>
						</blockquote>
					</li>
					<li style="list-style-type: none">
						<code>3</code> - Message code - depending on the message type, indicates
						focus on/off, keycode, mouse button number, etc.
					</li>
					<li style="list-style-type: none">
						<code>4</code> - Mouse X position on window
					</li>
					<li style="list-style-type: none">
						<code>5</code> - Mouse Y position on window
					</li>
					<li style="list-style-type: none">
						<code>6</code> - Keyboard Qualifier
					</li>
					<li style="list-style-type: none">
						<code>7</code> - Keyboard message: UTF-8 representation of key code, or
					</li>
					<li style="list-style-type: none">
						<code>7</code> - Refresh message: X position of damaged area
					</li>
					<li style="list-style-type: none">
						<code>8</code> - Refresh message: Y position of damaged area
					</li>
					<li style="list-style-type: none">
						<code>9</code> - Refresh message: Width of damaged area
					</li>
					<li style="list-style-type: none">
						<code>10</code> - Refresh message: Height of damaged area
					</li>
					<li style="list-style-type: none">
						<code>11</code> - Mouse X position on screen
					</li>
					<li style="list-style-type: none">
						<code>12</code> - Mouse Y position on screen
					</li>
				</ul>
			</blockquote>
			<p>
				A message will be acknowledged implicitely by garbage collection, or
				by invoking the <code>msg:reply(&#091;table&#093;)</code> method on it, in which case extra
				data can be returned to the sender. Valid fields in <code>table</code> are:
			</p>
			<blockquote>
				<ul>
					<li style="list-style-type: none">
						<code>UTF8Selection</code> - a string containing the selection buffer, in
						reply to messages of the type <code>MSG_REQSELECTION</code> 
					</li>
				</ul>
			</blockquote>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:getPaintInfo" id="Visual:getPaintInfo"><code>type = Visual:getPaintInfo()</code></a></h3>
			<p>
				Returns the type of background paint that
				is currently effective:
			</p>
			<blockquote>
				<ul>
					<li style="list-style-type: none">
						<code>0</code> - undefined
					</li>
					<li style="list-style-type: none">
						<code>1</code> - single-color pen
					</li>
					<li style="list-style-type: none">
						<code>2</code> - pixmap
					</li>
					<li style="list-style-type: none">
						<code>3</code> - gradient
					</li>
				</ul>
			</blockquote>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:getSelection" id="Visual:getSelection"><code>string = Visual:getSelection([type])</code></a></h3>
			<p>
				Gets the visual's selection of the
				specified type:
			</p>
			<blockquote>
				<ul>
					<li style="list-style-type: none">
						<code>1</code> - the selection (default)
					</li>
					<li style="list-style-type: none">
						<code>2</code> - the clipboard
					</li>
				</ul>
			</blockquote>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:getTextSize" id="Visual:getTextSize"><code>width, height = Visual.getTextSize(font, text)</code></a></h3>
			<p>
				Returns the width and
				height of the specified text when rendered with the given font. See also
				<a href="#Visual:textSize"><code>Visual:textSize()</code></a>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:getTime" id="Visual:getTime"><code>sec, millis = Visual.getTime()</code></a></h3>
			<p>
				Returns the system time in seconds and
				milliseconds.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:getUserData" id="Visual:getUserData"><code>data = Visual:getUserData()</code></a></h3>
			<p>
				Get the user data attached to a visual.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:open" id="Visual:open"><code>visual = Visual.open([args])</code></a></h3>
			<p>
				Opens a visual. Possible keys and their
				values in the <code>args</code> table:
			</p>
			<blockquote>
				<ul>
					<li style="list-style-type: none">
						<code>&quot;UserData&quot;</code> - Lua userdata attached to the visual
					</li>
					<li style="list-style-type: none">
						<code>&quot;Pens&quot;</code> - table, for looking up pens, pixmaps, and gradients
					</li>
					<li style="list-style-type: none">
						<code>&quot;Title&quot;</code> - string, window title (if applicable)
					</li>
					<li style="list-style-type: none">
						<code>&quot;Borderless&quot;</code> - bool, open window borderless (if applicable)
					</li>
					<li style="list-style-type: none">
						<code>&quot;PopupWindow&quot;</code> - bool, the window is used for a popup
					</li>
					<li style="list-style-type: none">
						<code>&quot;Center&quot;</code> - bool, try to open the window centered on the screen
					</li>
					<li style="list-style-type: none">
						<code>&quot;FullScreen&quot;</code> - bool, try to open in fullscreen mode
					</li>
					<li style="list-style-type: none">
						<code>&quot;Width&quot;</code> - number, width in pixels
					</li>
					<li style="list-style-type: none">
						<code>&quot;Height&quot;</code> - number, height in pixels
					</li>
					<li style="list-style-type: none">
						<code>&quot;Left&quot;</code> - number, left edge in pixels on the screen
					</li>
					<li style="list-style-type: none">
						<code>&quot;Top&quot;</code> - number, top edge in pixels on the screen
					</li>
					<li style="list-style-type: none">
						<code>&quot;MinWidth&quot;</code> - number, min. width for the window to shrink to
					</li>
					<li style="list-style-type: none">
						<code>&quot;MinHeight&quot;</code> - number, min. height for the window to shrink to
					</li>
					<li style="list-style-type: none">
						<code>&quot;MaxWidth&quot;</code> - number, max. width for the window to grow to
					</li>
					<li style="list-style-type: none">
						<code>&quot;MaxHeight&quot;</code> - number, max. height for the window to grow to
					</li>
					<li style="list-style-type: none">
						<code>&quot;EventMask&quot;</code> - number, mask of input message types, see also
						<a href="#Visual:getMsg"><code>Visual.getMsg()</code></a> for details
					</li>
					<li style="list-style-type: none">
						<code>&quot;BlankCursor&quot;</code> - bool, clear the mouse pointer over the window
					</li>
					<li style="list-style-type: none">
						<code>&quot;ExtraArgs&quot;</code> - string, extra arugments containing hints for the
						underlying display driver
					</li>
					<li style="list-style-type: none">
						<code>&quot;MsgFileNo&quot;</code> - number, of a file descriptor to read messages of
						type <code>MSG_USER</code> from. Default: the file number of <code>stdin</code> 
					</li>
				</ul>
			</blockquote>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:openFont" id="Visual:openFont"><code>font = Visual.openFont([name[, size[, attrs]]])</code></a></h3>
			<p>
				Opens a named font and,
				if successful, returns a handle on it. The size is measured in pixels.
				<code>attrs</code> is a string with each character representing a hint:
			</p>
			<blockquote>
				<ul>
					<li style="list-style-type: none">
						<code>&quot;s&quot;</code> - the font should be scalable
					</li>
					<li style="list-style-type: none">
						<code>&quot;b&quot;</code> - the font should be bold
					</li>
					<li style="list-style-type: none">
						<code>&quot;i&quot;</code> - the font should be slanted to the right
					</li>
				</ul>
			</blockquote>
			<p>
				It depends on the underlying font resource whether name, size, and
				attributes must match exactly for this function to succeed, and which of
				the attributes can and will be taken into account. In the case of the TTF
				freetype library, for example, it may be more promising to use names of
				fonts specifically crafted to be of the desired type, e.g.
				<code>&quot;DejaVuSans-BoldOblique&quot;</code>, rather than <code>&quot;DejaVuSans&quot;</code> with the
				attributes <code>&quot;ib&quot;</code>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:popClipRect" id="Visual:popClipRect"><code>Visual:popClipRect()</code></a></h3>
			<p>
				Pop a rectangle from the top of the stack
				of clipping rectangles.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:pushClipRect" id="Visual:pushClipRect"><code>Visual:pushClipRect(x0, y0, x1, y1)</code></a></h3>
			<p>
				Push a rectangle on top of the stack
				of clipping rectangles.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:setAttrs" id="Visual:setAttrs"><code>num = Visual:setAttrs(table)</code></a></h3>
			<p>
				Set attributes in a visual. Possible fields
				in the <code>table</code>, as currently defined:
			</p>
			<blockquote>
				<ul>
					<li style="list-style-type: none">
						<code>&quot;MinWidth&quot;</code> - number, minimum width the visual may shrink to
					</li>
					<li style="list-style-type: none">
						<code>&quot;MinHeight&quot;</code> - number, minimum height the visual may shrink to
					</li>
					<li style="list-style-type: none">
						<code>&quot;MaxWidth&quot;</code> - number, minimum width the visual may grow to
					</li>
					<li style="list-style-type: none">
						<code>&quot;MaxHeight&quot;</code> - number, minimum width the visual may grow to
					</li>
					<li style="list-style-type: none">
						<code>&quot;HaveSelection&quot;</code> - boolean, indicates that the visual has the
						selection
					</li>
					<li style="list-style-type: none">
						<code>&quot;HaveClipboard&quot;</code> - boolean, indicates that the visual has the
						clipboard
					</li>
					<li style="list-style-type: none">
						<code>&quot;Left&quot;</code> - number, left edge of the visual on the screen, in pixels
					</li>
					<li style="list-style-type: none">
						<code>&quot;Top&quot;</code> - number, top edge of the visual on the screen, in pixels
					</li>
					<li style="list-style-type: none">
						<code>&quot;Width&quot;</code> - number, width of the visual on the screen, in pixels
					</li>
					<li style="list-style-type: none">
						<code>&quot;Height&quot;</code> - number, height of the visual on the screen, in pixels
					</li>
					<li style="list-style-type: none">
						<code>&quot;WindowHints&quot;</code> - string, with each character acting as a hint
						to window management. Currently defined:
						<blockquote>
							<ul>
								<li style="list-style-type: none">
									<code>&quot;t&quot;</code> - <em>top</em>, to raise the window on top of all others
								</li>
							</ul>
						</blockquote>
					</li>
				</ul>
			</blockquote>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:setBGPen" id="Visual:setBGPen"><code>Visual:setBGPen(paint[, tx[, ty]])</code></a></h3>
			<p>
				Set the visual's pen, pixmap or
				gradient for rendering backgrounds. Also, optionally, sets a pixmap's or
				gradient's texture origin.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:setClipRect" id="Visual:setClipRect"><code>Visual:setClipRect(x0, y0, x1, y1)</code></a></h3>
			<p>
				Set clipping rectangle
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:setFont" id="Visual:setFont"><code>Visual:setFont(font)</code></a></h3>
			<p>
				Set the visual's current font.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:setInput" id="Visual:setInput"><code>Visual:setInput(inputmask)</code></a></h3>
			<p>
				For a visual, specifies a set of input
				message types the caller wishes to add to the set of messages to be
				received. For the valid types, see <a href="#Visual:getMsg"><code>Visual.getMsg()</code></a>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:setSelection" id="Visual:setSelection"><code>Visual:setSelection(string, [type])</code></a></h3>
			<p>
				Sets the visual's selection
				of the specified type:
			</p>
			<blockquote>
				<ul>
					<li style="list-style-type: none">
						<code>1</code> - the selection (default)
					</li>
					<li style="list-style-type: none">
						<code>2</code> - the clipboard
					</li>
				</ul>
			</blockquote>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:setShift" id="Visual:setShift"><code>Visual:setShift(sx, sy)</code></a></h3>
			<p>
				Set coordinate displacement in visual
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:setTextureOrigin" id="Visual:setTextureOrigin"><code>otx, oty = Visual:setTextureOrigin(tx, ty)</code></a></h3>
			<p>
				Sets the texture origin for
				the drawing operations <a href="#Visual:fillRect"><code>Visual:fillRect()</code></a> and <a href="#Visual:drawText"><code>Visual:drawText()</code></a>, and
				returns the old texture origin.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:sleep" id="Visual:sleep"><code>Visual.sleep(ms)</code></a></h3>
			<p>
				Suspends the caller waiting for the specified number of
				1/1000th seconds
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:textSize" id="Visual:textSize"><code>width, height = Visual:textSize(text)</code></a></h3>
			<p>
				Get width and height of the given
				text, if rendered with the visual's current font. See also
				<a href="#Visual:getTextSize"><code>Visual.getTextSize()</code></a>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:unsetClipRect" id="Visual:unsetClipRect"><code>Visual:unsetClipRect()</code></a></h3>
			<p>
				Unset clipping rectangle
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Visual:wait" id="Visual:wait"><code>Visual.wait()</code></a></h3>
			<p>
				Suspends the caller waiting for any event from any window.
			</p>
			<hr class="page-break" />
		</div>
		<div class="node"><h2><a name="tek.ui" id="tek.ui">ui (v54.1)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						This module is the user interface toolkit's base library. It implements
						a class loader and support functions, and it provides a central place
						for various constants and defaults. To invoke the class loader, simply
						aquire a class from the <code>tek.ui</code> table, e.g. this will load the
						<a href="#tek.ui.class.application">tek.ui.class.application</a> class, as well as all subsequently
						needed classes:
					</p>
<pre>
local ui = require &quot;tek.ui&quot;
ui.Application:new { ...
</pre>
				</blockquote>
			</div>
			<div class="definition"><dfn>FUNCTIONS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#ui:checkVersion"><code>ui.checkVersion()</code></a> - Checks tekUI global version
						</li>
						<li style="list-style-type: none">
							<a href="#ui:createHook"><code>ui.createHook()</code></a> - Creates a hook object
						</li>
						<li style="list-style-type: none">
							<a href="#ui:destroyHook"><code>ui.destroyHook()</code></a> - Destroys a hook object
						</li>
						<li style="list-style-type: none">
							<a href="#ui:getStockImage"><code>ui.getStockImage()</code></a> - Gets a stock image object
						</li>
						<li style="list-style-type: none">
							<a href="#ui:extractKeyCode"><code>ui.extractKeyCode()</code></a> - Extracts a keycode from a string
						</li>
						<li style="list-style-type: none">
							<a href="#ui:getLocale"><code>ui.getLocale()</code></a> - Gets a locale catalog
						</li>
						<li style="list-style-type: none">
							<a href="#ui:loadClass"><code>ui.loadClass()</code></a> - Loads a named class
						</li>
						<li style="list-style-type: none">
							<a href="#ui:loadImage"><code>ui.loadImage()</code></a> - Retrieves an image (possibly from an image cache)
						</li>
						<li style="list-style-type: none">
							<a href="#ui:loadLibrary"><code>ui.loadLibrary()</code></a> - Loads a library
						</li>
						<li style="list-style-type: none">
							<a href="#ui:loadStyleSheet"><code>ui.loadStyleSheet()</code></a> - Loads and parses a style sheet file
						</li>
						<li style="list-style-type: none">
							<a href="#ui:loadTable"><code>ui.loadTable()</code></a> - Loads a table from some standard path
						</li>
						<li style="list-style-type: none">
							<a href="#ui:require"><code>ui.require()</code></a> - Loads an user interface class
						</li>
						<li style="list-style-type: none">
							<a href="#ui:resolveKeyCode"><code>ui.resolveKeyCode()</code></a> - Converts a keycode into keys and qualifiers
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>CONSTANTS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<code>VERSION</code> 
							<blockquote>
								<ul>
									<li style="list-style-type: none">
										Overall package version number of tekUI, starting at <code>100</code> 
										for version 1.00. (Not to be confused with the ui module's
										<code>_VERSION</code> <em>string</em>, with underscore)
									</li>
								</ul>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>VERSIONSTRING</code> 
							<blockquote>
								<ul>
									<li style="list-style-type: none">
										String representation of the overall package version number
									</li>
								</ul>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>HUGE</code> 
							<blockquote>
								<ul>
									<li style="list-style-type: none">
										This constant is used to express a 'huge' spatial extent on a
										given axis, e.g. <code>Width = ui.HUGE</code> indicates that you wish no
										specific size limit on the X axis.
									</li>
								</ul>
							</blockquote>
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>DEFAULTS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<code>DBLCLICKJITTER</code> 
							<blockquote>
								<ul>
									<li style="list-style-type: none">
										Maximum sum of squared delta mouse positions (dx&#178; + dy&#178;) for
										a pair of mouse clicks to be accepted as a double click. The
										default is <code>70</code>. Large touchscreens may require a much larger
										value.
									</li>
								</ul>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>DBLCLICKTIME</code> 
							<blockquote>
								<ul>
									<li style="list-style-type: none">
										Maximum number of microseconds between mouse clicks to be
										recognized as a double click. Default: <code>32000</code>. Use a larger
										value for touchscreens.
									</li>
								</ul>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>ThemeName</code> 
							<blockquote>
								<ul>
									<li style="list-style-type: none">
										Setting this variable overrides the <code>THEME</code> environment
										variable and enforces the usage of the specified cascade, up to
										the point where the application's author styles are considered.
									</li>
								</ul>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>UserStyles</code> 
							<blockquote>
								<ul>
									<li style="list-style-type: none">
										Name of the user stylesheet file. Default: <code>&quot;user&quot;</code>. Can
										be set to <strong>false</strong> to be disabled.
									</li>
								</ul>
							</blockquote>
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>MESSAGE TYPE CONSTANTS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<code>MSG_CLOSE</code> 
							<blockquote>
								<ul>
									<li style="list-style-type: none">
										Message sent when a window was closed
									</li>
								</ul>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>MSG_FOCUS</code> 
							<blockquote>
								<ul>
									<li style="list-style-type: none">
										A window has been activated or deactivated
									</li>
								</ul>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>MSG_INTERVAL</code> 
							<blockquote>
								<ul>
									<li style="list-style-type: none">
										50Hz Timer interval message
									</li>
								</ul>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>MSG_KEYDOWN</code> 
							<blockquote>
								<ul>
									<li style="list-style-type: none">
										Key pressed down
									</li>
								</ul>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>MSG_KEYUP</code> 
							<blockquote>
								<ul>
									<li style="list-style-type: none">
										Key released
									</li>
								</ul>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>MSG_MOUSEBUTTON</code> 
							<blockquote>
								<ul>
									<li style="list-style-type: none">
										Mousebutton pressed or released
									</li>
								</ul>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>MSG_MOUSEMOVE</code> 
							<blockquote>
								<ul>
									<li style="list-style-type: none">
										Mouse pointer moved
									</li>
								</ul>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>MSG_MOUSEOVER</code> 
							<blockquote>
								<ul>
									<li style="list-style-type: none">
										Mouse pointer has entered or left the window
									</li>
								</ul>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>MSG_NEWSIZE</code> 
							<blockquote>
								<ul>
									<li style="list-style-type: none">
										A window has been resized
									</li>
								</ul>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>MSG_REFRESH</code> 
							<blockquote>
								<ul>
									<li style="list-style-type: none">
										A window needs a (partial) refresh
									</li>
								</ul>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>MSG_USER</code> 
							<blockquote>
								<ul>
									<li style="list-style-type: none">
										User message
									</li>
								</ul>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>MSG_SIGNAL</code> 
							<blockquote>
								<ul>
									<li style="list-style-type: none">
										System signal message. Msg code indicates type of signal;
										<code>0</code> - abortion signal
									</li>
								</ul>
							</blockquote>
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>NOTIFICATIONS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<code>NOTIFY_ALWAYS</code> - see <a href="#tek.class.object">Object</a> 
						</li>
						<li style="list-style-type: none">
							<code>NOTIFY_VALUE</code> - see <a href="#tek.class.object">Object</a> 
						</li>
						<li style="list-style-type: none">
							<code>NOTIFY_TOGGLE</code> - see <a href="#tek.class.object">Object</a> 
						</li>
						<li style="list-style-type: none">
							<code>NOTIFY_FORMAT</code> - see <a href="#tek.class.object">Object</a> 
						</li>
						<li style="list-style-type: none">
							<code>NOTIFY_SELF</code> - see <a href="#tek.class.object">Object</a> 
						</li>
						<li style="list-style-type: none">
							<code>NOTIFY_OLDVALUE</code> - see <a href="#tek.class.object">Object</a> 
						</li>
						<li style="list-style-type: none">
							<code>NOTIFY_FUNCTION</code> - see <a href="#tek.class.object">Object</a> 
						</li>
						<li style="list-style-type: none">
							<code>NOTIFY_WINDOW</code> - see <a href="#tek.class.object">Object</a>,
							defined in <a href="#tek.ui.class.element">Element</a> 
						</li>
						<li style="list-style-type: none">
							<code>NOTIFY_APPLICATION</code> - see <a href="#tek.class.object">Object</a>,
							defined in <a href="#tek.ui.class.element">Element</a> 
						</li>
						<li style="list-style-type: none">
							<code>NOTIFY_ID</code> - see <a href="#tek.class.object">Object</a>,
							defined in <a href="#tek.ui.class.element">Element</a> 
						</li>
						<li style="list-style-type: none">
							<code>NOTIFY_COROUTINE</code> - see <a href="#tek.class.object">Object</a>,
							defined in <a href="#tek.ui.class.element">Element</a> 
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>SEE ALSO</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#ClassOverview">ClassOverview</a> 
						</li>
					</ul>
				</blockquote>
				<hr />
			</div>
		</div>
		<div class="node"><h3><a name="ui:checkVersion" id="ui:checkVersion"><code>ui = checkVersion(version)</code></a></h3>
			<p>
				raises an error if the tekUI version number is
				less than the requested version. This can be used in the following idiom:
				 ui = require &quot;tek.ui&quot;.checkVersion(107)
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="ui:createHook" id="ui:createHook"><code>hookobject = ui.createHook(realm, classname, parent[, table])</code></a></h3>
			<p>
				Loads a
				class of the given <code>realm</code> and <code>classname</code>, instantiates it (optionally
				passing it <code>table</code> for initialization), connects it to the specified
				<code>parent</code> element, and calls its <code>setup()</code> method. If <code>classname</code> is
				the pre-defined name <code>&quot;none&quot;</code>, this function returns <strong>false</strong>. Refer
				also to <a href="#ui:loadClass"><code>ui.loadClass()</code></a> for further details.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="ui:destroyHook" id="ui:destroyHook"><code>false = ui.destroyHook([hookobject])</code></a></h3>
			<p>
				Destroys a hook object by invoking
				its <code>cleanup()</code> and <code>disconnect()</code> methods. Always returns <strong>false</strong>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="ui:extractKeyCode" id="ui:extractKeyCode"><code>ui.extractKeyCode(string[, shortcutmark])</code></a></h3>
			<p>
				Extract a shortcut character
				from a string. The default shortcut marker is an underscore.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="ui:getLocale" id="ui:getLocale"><code>catalog = ui.getLocale(appid[, vendordomain[, deflang[, language]]])</code></a></h3>
			<p>
				Returns a table of locale strings for the given application Id and vendor
				domain. <code>deflang</code> (default: <code>&quot;en&quot;</code>) is used as the default language
				code if a catalog for the requested language is unavailable. If no
				<code>language</code> code is specified, then the preferred language will be
				obtained from the operating system or desktop environment. If no catalog
				file was found or non-existent keys are used to access the resulting
				catalog, the key will be echoed with underscores turned into spaces; for
				example, if <code>catalog</code> contained no string for the given key, accessing
				<code>catalog.HELLO_WORLD</code> would return the string <code>&quot;HELLO WORLD&quot;</code>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="ui:getStockImage" id="ui:getStockImage"><code>imgobject = ui.getStockImage(name, ...)</code></a></h3>
			<p>
				Creates an image object of a
				named class, corresponding to classes found in <code>tek/ui/image</code>. Extra
				arguments are passed on as <code>imageclass:new(...)</code>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="ui:getStyleSheet" id="ui:getStyleSheet"><code>properties, errmsg = ui.getStyleSheet([name])</code></a></h3>
			<p>
				Aquires a style sheet
				from memory, by loading it from disk, or by determining properties at
				runtime. Predefined names are:
			</p>
			<blockquote>
				<ul>
					<li style="list-style-type: none">
						<code>&quot;minimal&quot;</code> - the hardcoded internal <em>user agent</em> style sheet
					</li>
					<li style="list-style-type: none">
						<code>&quot;desktop&quot;</code> - An external style sheet named &quot;desktop.css&quot;,
						overlayed with the color scheme (and possibly other properties) of
						the running desktop (if applicable)
					</li>
				</ul>
			</blockquote>
			<p>
				Any other name will cause this function to attempt to load an equally
				named style sheet file.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="ui:loadClass" id="ui:loadClass"><code>class = ui.loadClass(realm, classname[, min_version])</code></a></h3>
			<p>
				Loads a class of the given <code>classname</code> from the specified <code>realm</code>,
				and optionally with a minimum version requirement.
				Returns the loaded class or <strong>false</strong> if the class or realm is
				unknown, if the version requirement cannot be satisfied, or if an error
				occured in the module. Currently defined values for <code>realm</code> are:
			</p>
			<blockquote>
				<ul>
					<li style="list-style-type: none">
						<code>&quot;border&quot;</code> - border classes
					</li>
					<li style="list-style-type: none">
						<code>&quot;class&quot;</code> - user interface element classes
					</li>
					<li style="list-style-type: none">
						<code>&quot;hook&quot;</code> - drawing hook classes
					</li>
					<li style="list-style-type: none">
						<code>&quot;image&quot;</code> - image classes
					</li>
					<li style="list-style-type: none">
						<code>&quot;layout&quot;</code> - group layouting classes
					</li>
				</ul>
			</blockquote>
			<hr />
		</div>
		<div class="node"><h3><a name="ui:loadImage" id="ui:loadImage"><code>imgobject = ui.loadImage(name)</code></a></h3>
			<p>
				Loads an image from a file or retrieves
				it from the image cache. Currently supported are the PPM and PNG file
				formats. (PPM support is built-in, while PNG support may depend on the
				build configuration.)
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="ui:loadLibrary" id="ui:loadLibrary"><code>ui.loadLibrary(name[, version])</code></a></h3>
			<p>
				Loads a library with at least the
				specified major version, from a local or global path starting with
				<code>tek/lib</code>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="ui:loadStyleSheet" id="ui:loadStyleSheet"><code>properties, msg = ui.loadStyleSheet(file)</code></a></h3>
			<p>
				This function loads a style
				sheet from the specified file (which can be a name or an open file handle),
				and parses it into a table of style classes with properties. If parsing
				failed, the return value is <strong>false</strong> and <code>msg</code> contains an error
				message.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="ui:loadTable" id="ui:loadTable"><code>table, msg = ui.loadTable(fname)</code></a></h3>
			<p>
				This function tries to load a file from
				the various possible locations as defined by <code>ui.LocalPath</code>, interpretes
				it is as Lua source, and returns its contents as keys and values of a
				table. If unsuccessful, returns <strong>nil</strong> followed by an error message.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="ui:require" id="ui:require"><code>ui.require(name[, version])</code></a></h3>
			<p>
				Loads an user interface class with at least
				the specified major version. This function is a shortcut for
				<code>ui.loadClass(&quot;class&quot;, ...)</code> - see <a href="#ui:loadClass"><code>ui.loadClass()</code></a> for more details.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="ui:resolveKeyCode" id="ui:resolveKeyCode"><code>key, quals = ui.resolveKeyCode(code)</code></a></h3>
			<p>
				Resolves a combined keycode specifier
				(e.g. <code>&quot;Ctrl+Shift+Q&quot;</code>) into a key string and a table of qualifier codes.
			</p>
			<hr class="page-break" />
		</div>
		<div class="node"><h2><a name="tek.ui.class.application" id="tek.ui.class.application">Application (v43.1)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> :
						<a href="#tek.class">Class</a> /
						<a href="#tek.ui.class.family">Family</a> /
						Application 
					</p>
					<p>
						This class implements tekUI's application, entrypoint and main loop.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>EXAMPLE</dfn>
				<blockquote>
					<p>
						A tekUI application can be written in a single, nested expression:
					</p>
<pre>
local ui = require &quot;tek.ui&quot;
ui.Application:new {
  Children = {
    ui.Window:new {
      Children = {
        ui.Button:new { Text = &quot;Hello World&quot; }
      }
    }
  }
}:run()
</pre>
				</blockquote>
			</div>
			<div class="definition"><dfn>MEMBERS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<code>ApplicationId &#091;IG&#093;</code> (string)
							<blockquote>
								<p>
									Name of the application, normally used as an unique identifier
									in combination with the <code>Domain</code> attribute. Default is
									<code>&quot;unknown&quot;</code>.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Author &#091;IG&#093;</code> (string)
							<blockquote>
								<p>
									Names of the application's authors. Default: <code>&quot;unknown&quot;</code> 
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>AuthorStyles &#091;IG&#093;</code> (string)
							<blockquote>
								<p>
									A string containing style sheet notation, overlaying all other
									properties, including those retrieved using the
									<code>AuthorStyleSheets</code> attribute.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>AuthorStyleSheets &#091;IG&#093;</code> (string)
							<blockquote>
								<p>
									A string containing the names of author style sheet files
									overlaying user agent and theme declaration. Multiple style
									sheets are separated by spaces. The last style sheet has the
									highest precedence, e.g. <code>&quot;desktop texture&quot;</code> would load the
									style sheets <code>desktop.css</code> and <code>texture.css</code>.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Copyright &#091;IG&#093;</code> (string)
							<blockquote>
								<p>
									Copyright notice applying to the application, default
									<code>&quot;unknown&quot;</code> 
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Display &#091;IG&#093;</code> (<a href="#tek.ui.class.display">Display</a>)
							<blockquote>
								<p>
									An initial <a href="#tek.ui.class.display">Display</a>. By default, the
									application creates a new one during <a href="#Application:new"><code>Application.new()</code></a>.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Domain &#091;IG&#093;</code> (string)
							<blockquote>
								<p>
									An uniquely identifying domain name of the vendor, organization
									or author manufacturing the application (preferrably without
									domain parts like <code>&quot;www.&quot;</code> if they are not significant for
									identification). Default is <code>&quot;unknown&quot;</code>.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>GCControl &#091;IG&#093;</code> (boolean or string)
							<blockquote>
								<p>
									The application can perform a garbage collection of the specified
									type directly before getting suspended waiting for input. If set
									to <strong>false</strong>, no explicit garbage collection is initiated. If
									the value is <strong>true</strong> or <code>&quot;step&quot;</code>, the application performs a
									single garbage collection step. Other values (e.g. <code>&quot;collect&quot;</code>)
									are passed unmodified to <code>collectgarbage()</code>. Default: <strong>true</strong> 
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>ProgramName &#091;IG&#093;</code> (string)
							<blockquote>
								<p>
									Name of the application, as displayed to the user. This is
									also the fallback for the <code>Title</code> attribute in windows.
									If unset, the default will be <code>&quot;tekUI&quot;</code>.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Status &#091;G&#093;</code> (string)
							<blockquote>
								<p>
									Status of the application, can be <code>&quot;init&quot;</code>, <code>&quot;error&quot;</code>,
									<code>&quot;run&quot;</code>, <code>&quot;quit&quot;</code>.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Vendor &#091;IG&#093;</code> (string)
							<blockquote>
								<p>
									Name of the vendor or organization responsible for producing
									the application, as displayed to the user. Default <code>&quot;unknown&quot;</code>.
								</p>
							</blockquote>
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>NOTES</dfn>
				<blockquote>
					<p>
						The <code>Domain</code> and <code>ApplicationId</code> attributes are
						UTF-8 encoded strings, so any international character sequence is
						valid for them. Anyhow, it is recommended to avoid too adventurous
						symbolism, as its end up in a hardly decipherable, UTF-8 plus
						URL-encoded form in the file system, e.g. for loading catalog files
						from <code>tek/ui/locale/&lt;domain&gt;/&lt;applicationid&gt;</code>.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>IMPLEMENTS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Application:addCoroutine"><code>Application:addCoroutine()</code></a> - Adds a coroutine to the application
						</li>
						<li style="list-style-type: none">
							<a href="#Application:addInputHandler"><code>Application:addInputHandler()</code></a> - Adds input handler to the application
						</li>
						<li style="list-style-type: none">
							<a href="#Application:connect"><code>Application:connect()</code></a> - Connects children recursively
						</li>
						<li style="list-style-type: none">
							<a href="#Application:easyRequest"><code>Application:easyRequest()</code></a> - Opens a message box
						</li>
						<li style="list-style-type: none">
							<a href="#Application:getById"><code>Application:getById()</code></a> - Returns an element by Id
						</li>
						<li style="list-style-type: none">
							<a href="#Application:getChildren"><code>Application:getChildren()</code></a> - Returns the application's children
						</li>
						<li style="list-style-type: none">
							<a href="#Application:getGroup"><code>Application:getGroup()</code></a> - Returns the application's group
						</li>
						<li style="list-style-type: none">
							<a href="#Application:getLocale"><code>Application:getLocale()</code></a> - Returns a locale for the application
						</li>
						<li style="list-style-type: none">
							<a href="#Application:quit"><code>Application:quit()</code></a> - Quits the application
						</li>
						<li style="list-style-type: none">
							<a href="#Application:obtainClipboard"><code>Application:obtainClipboard()</code></a> - Obtain application clipboard access
						</li>
						<li style="list-style-type: none">
							<a href="#Application:releaseClipboard"><code>Application:releaseClipboard()</code></a> - Release application clipboard
						</li>
						<li style="list-style-type: none">
							<a href="#Application:remInputHandler"><code>Application:remInputHandler()</code></a> - Removes a registered input handler
						</li>
						<li style="list-style-type: none">
							<a href="#Application:requestFile"><code>Application:requestFile()</code></a> - Opens a file requester
						</li>
						<li style="list-style-type: none">
							<a href="#Application:run"><code>Application:run()</code></a> - Runs the application
						</li>
						<li style="list-style-type: none">
							<a href="#Application:suspend"><code>Application:suspend()</code></a> - Suspends the caller's coroutine
						</li>
						<li style="list-style-type: none">
							<a href="#Application:up"><code>Application:up()</code></a> - Function called when the application is up
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>OVERRIDES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Family:addMember"><code>Family:addMember()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Class:new"><code>Class.new()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Family:remMember"><code>Family:remMember()</code></a> 
						</li>
					</ul>
				</blockquote>
				<hr />
			</div>
		</div>
		<div class="node"><h3><a name="Application:addCoroutine" id="Application:addCoroutine"><code>addCoroutine(function, arg1, ...)</code></a></h3>
			<p>
				Adds the specified function
				and arguments to the application as a new coroutine, and returns to the
				caller. The new coroutine is not started immediately, but scheduled for
				later execution during the application's update procedure. This gives the
				application an opportunity to service all pending messages and updates
				before the coroutine is actually started.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Application:addInputHandler" id="Application:addInputHandler"><code>addInputHandler(msgtype, object, func)</code></a></h3>
			<p>
				Adds an <code>object</code> and
				<code>function</code> to the application's chain of handlers for input of
				the specified type. Currently, the only message type an appliction is
				able to react on is <code>ui.MSG_USER</code>. All other message types are specific
				to a Window. Input handlers are invoked as follows:
			</p>
<pre>
message = function(object, message)
</pre>
			<p>
				The handler is expected to return the message, which will in turn pass
				it on to the next handler in the chain.
				See also <a href="#Window:addInputHandler"><code>Window:addInputHandler()</code></a> for more information.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Application:connect" id="Application:connect"><code>connect(parent)</code></a></h3>
			<p>
				Checks member linkage and connects all children by
				invoking their <a href="#Element:connect">connect()</a> methods. Note that
				unlike <a href="#Element:connect"><code>Element:connect()</code></a>, this function is recursive.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Application:easyRequest" id="Application:easyRequest"><code>selected = easyRequest(title, text, buttontext1[, ...])</code></a></h3>
			<p>
				This function shows a message box or requester. <code>title</code> will be
				displayed as the window title; if this argument is <strong>false</strong>, the
				application's <code>ProgramName</code> will be used for the title. <code>text</code> 
				(which may contain line breaks) will be used as the requester's body.
				Buttons are ordered from left to right. The first button has the number 1.
				If the window is closed using the Escape key or close button, the return
				value will be <code>false</code>. Note: The caller of this function must be
				running in a coroutine (see <a href="#Application:addCoroutine"><code>Application:addCoroutine()</code></a>).
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Application:getById" id="Application:getById"><code>element = getById(id)</code></a></h3>
			<p>
				Returns the element that was registered with the
				Application under its unique <code>id</code>. Returns <strong>nil</strong> if the id was not
				found.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Application:getChildren" id="Application:getChildren"><code>getChildren()</code></a></h3>
			<p>
				See <a href="#Area:getChildren"><code>Area:getChildren()</code></a>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Application:getGroup" id="Application:getGroup"><code>getGroup()</code></a></h3>
			<p>
				See <a href="#Area:getGroup"><code>Area:getGroup()</code></a>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Application:getLocale" id="Application:getLocale"><code>getLocale([deflang[, language]])</code></a></h3>
			<p>
				Returns a table of locale strings for
				<code>ApplicationId</code> and <code>Domain</code>. See <a href="#ui:getLocale"><code>ui.getLocale()</code></a> for more information.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Application:obtainClipboard" id="Application:obtainClipboard"><code>c = obtainClipboard([mode])</code></a></h3>
			<p>
				Obtain clipboard table, optional <code>mode</code> 
				can be <code>&quot;empty&quot;</code>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Application:quit" id="Application:quit"><code>quit()</code></a></h3>
			<p>
				Quits the application.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Application:releaseSetClipboard" id="Application:releaseSetClipboard"><code>releaseSetClipboard([c])</code></a></h3>
			<p>
				Release clipboard, optionally setting a new one.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Application:remInputHandler" id="Application:remInputHandler"><code>remInputHandler(msgtype, object, func)</code></a></h3>
			<p>
				Removes an input handler that was
				previously registered with <a href="#Application:addInputHandler"><code>Application:addInputHandler()</code></a>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Application:requestFile" id="Application:requestFile"><code>status[, path, selection] = requestFile(args)</code></a></h3>
			<p>
				Requests a single or multiple files or directories. Possible keys in
				the <code>args</code> table are:
			</p>
			<blockquote>
				<ul>
					<li style="list-style-type: none">
						<code>Center</code> - Boolean, whether requester should be opened centered
					</li>
					<li style="list-style-type: none">
						<code>FocusElement</code> - What element to place the initial focus on;
						see <a href="#tek.ui.class.dirlist">DirList</a> for possible values
					</li>
					<li style="list-style-type: none">
						<code>Height</code> - Height of the requester window
					</li>
					<li style="list-style-type: none">
						<code>Lister</code> - External lister object to operate on
					</li>
					<li style="list-style-type: none">
						<code>Location</code> - Initial contents of the requester's location field
					</li>
					<li style="list-style-type: none">
						<code>OverWindow</code> - Open dialogue centered over the specified window
					</li>
					<li style="list-style-type: none">
						<code>Path</code> - The initial path
					</li>
					<li style="list-style-type: none">
						<code>SelectMode</code> - <code>&quot;multi&quot;</code> or <code>&quot;single&quot;</code> &#091;default <code>&quot;single&quot;</code>&#093;
					</li>
					<li style="list-style-type: none">
						<code>SelectText</code> - Text to show on the select button
						&#091;default <code>&quot;open&quot;</code>&#093;
					</li>
					<li style="list-style-type: none">
						<code>Title</code> - Window title &#091;default <code>&quot;Select file or directory...&quot;</code>&#093;
					</li>
					<li style="list-style-type: none">
						<code>Width</code> - Width of the requester window
					</li>
				</ul>
			</blockquote>
			<p>
				The first return value is a string reading either <code>&quot;selected&quot;</code> or
				<code>&quot;cancelled&quot;</code>. If the status is <code>&quot;selected&quot;</code>, the second return value
				is the path where the requester was left, and the third value is a table
				of the items that were selected.
				Note: The caller of this function must be running in a coroutine
				(see <a href="#Application:addCoroutine"><code>Application:addCoroutine()</code></a>).
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Application:run" id="Application:run"><code>success, status = run()</code></a></h3>
			<p>
				Runs the application. Returns when all child
				windows are closed or when the application's <code>Status</code> is set to &quot;quit&quot;.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Application:setLastKey" id="Application:setLastKey"><code>retrig = setLastKey([newkey])</code></a></h3>
			<p>
				Sets <code>newkey</code> as the key that was last
				pressed in the application. If no new key is given, the current key is
				unset. Returns a boolean indicating whether it is the same as the
				previously registered key.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Application:suspend" id="Application:suspend"><code>suspend([window])</code></a></h3>
			<p>
				Suspends the caller (which must be running
				in a coroutine) until it is getting rescheduled by the application.
				Coroutines can use this as a cooperation point, which gives the
				application an opportunity to service all pending messages and updates.
				If no argument is given, the application returns to the caller as quickly
				as possible. If an optional <code>window</code> is specified, the coroutine is put
				to sleep until something happens in the application, or an interval timer
				event is present at the window (i.e. the suspended coroutine is
				rescheduled after no longer than 1/50th of a second).
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Application:up" id="Application:up"><code>up()</code></a></h3>
			<p>
				This function is called when the application is fully initialized
				and about to enter its main loop. The user can overwrite it e.g. to
				add a coroutine that shows a splash screen.
			</p>
			<hr class="page-break" />
		</div>
		<div class="node"><h2><a name="tek.ui.class.area" id="tek.ui.class.area">Area (v57.5)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> :
						<a href="#tek.class">Class</a> /
						<a href="#tek.class.object">Object</a> /
						<a href="#tek.ui.class.element">Element</a> /
						Area / <select onchange="if (this.value != '') window.location.href = this.value; this.selectedIndex = 0;"><option value="">1 subclasses</option><option value="#tek.ui.class.frame">Frame</option></select>
					</p>
					<p>
						This is the base class of all visible user interface elements.
						It implements an outer margin, layouting, drawing, and the
						relationships to its neighbour elements.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>ATTRIBUTES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<code>AutoPosition &#091;I&#093;</code> (boolean)
							<blockquote>
								<p>
									When the element receives the focus, this flag instructs it to
									automatically position itself into the visible area of any Canvas
									that may contain it. An affected <a href="#tek.ui.class.canvas">Canvas</a> 
									must have its <code>AutoPosition</code> attribute enabled as well for this
									option to take effect (but unlike the Area class, in a Canvas it
									is disabled by default).
									The boolean (default <strong>true</strong>) will be translated to the flag
									<code>FL_AUTOPOSITION</code>, and is meaningless after initialization.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>BGPen &#091;G&#093;</code> (color specification)
							<blockquote>
								<p>
									The current color (or texture) for painting the element's
									background. This value is set in <a href="#Area:setState"><code>Area:setState()</code></a>, where it is
									derived from the element's current state and the
									<em>background-color</em> style property. Valid are color names (e.g.
									<code>&quot;detail&quot;</code>, <code>&quot;fuchsia&quot;</code>, see also
									<a href="#tek.ui.class.display">Display</a> for more), a hexadecimal RGB
									specification (e.g. <code>&quot;#334455&quot;</code>, <code>&quot;#f0f&quot;</code>), or an image URL
									in the form <code>&quot;url(...)&quot;</code>.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>DamageRegion &#091;G&#093;</code> (<a href="#tek.lib.region">Region</a>)
							<blockquote>
								<p>
									see <code>TrackDamage</code> 
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Disabled &#091;ISG&#093;</code> (boolean)
							<blockquote>
								<p>
									If <strong>true</strong>, the element is in disabled state and loses its
									ability to interact with the user. This state variable is handled
									in the <a href="#tek.ui.class.widget">Widget</a> class.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>EraseBG &#091;I&#093;</code> (boolean)
							<blockquote>
								<p>
									If <strong>true</strong>, the element's background is painted automatically
									using the <a href="#Area:erase"><code>Area:erase()</code></a> method. Set this attribute to <strong>false</strong> 
									if you intend to paint the background yourself in <a href="#Area:draw"><code>Area:draw()</code></a>.
									The boolean (default <strong>true</strong>) will be translated to the flag
									<code>FL_ERASEBG</code>, and is meaningless after initialization.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Flags &#091;SG&#093;</code> (Flags field)
							<blockquote>
								<p>
									This attribute holds various status flags, among others:
								</p>
								<ul>
									<li style="list-style-type: none">
										<code>FL_SETUP</code> - Set in <a href="#Area:setup"><code>Area:setup()</code></a> and cleared in <a href="#Area:cleanup"><code>Area:cleanup()</code></a> 
									</li>
									<li style="list-style-type: none">
										<code>FL_LAYOUT</code> - Set in <a href="#Area:layout"><code>Area:layout()</code></a>, cleared in <a href="#Area:cleanup"><code>Area:cleanup()</code></a> 
									</li>
									<li style="list-style-type: none">
										<code>FL_SHOW</code> - Set in <a href="#Area:show"><code>Area:show()</code></a>, cleared in <a href="#Area:hide"><code>Area:hide()</code></a> 
									</li>
									<li style="list-style-type: none">
										<code>FL_REDRAW</code> - Set in <a href="#Area:layout"><code>Area:layout()</code></a>, <a href="#Area:damage"><code>Area:damage()</code></a>,
										<a href="#Area:setState"><code>Area:setState()</code></a> and possibly other places to indicate that the
										element needs to be repainted. Cleared in <a href="#Area:draw"><code>Area:draw()</code></a>.
									</li>
									<li style="list-style-type: none">
										<code>FL_REDRAWBORDER</code> - To indicate a repaint of the element's
										borders. Handled in the <a href="#tek.ui.class.frame">Frame</a> class.
									</li>
									<li style="list-style-type: none">
										<code>FL_CHANGED</code> - This flag indicates that the contents of an
										element have changed, i.e. when children were added to a group,
										or when setting a new text or image should cause a recalculation
										of its size.
									</li>
									<li style="list-style-type: none">
										<code>FL_POPITEM</code> - Used to identify elements in popups, handled in
										<a href="#tek.ui.class.popitem">PopItem</a>.
									</li>
								</ul>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Focus &#091;SG&#093;</code> (boolean)
							<blockquote>
								<p>
									If <strong>true</strong>, the element has the input focus. This state variable
									is handled by the <a href="#tek.ui.class.widget">Widget</a> class. Note:
									This attribute represents only the current state. If you want to
									place the initial focus on an element, use the <code>InitialFocus</code> 
									attribute in the <a href="#tek.ui.class.widget">Widget</a> class.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>HAlign &#091;IG&#093;</code> (<code>&quot;left&quot;</code>, <code>&quot;center&quot;</code>, <code>&quot;right&quot;</code>)
							<blockquote>
								<p>
									Horizontal alignment of the element in its group. This attribute
									can be controlled using the <code>halign</code> style property.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Height &#091;IG&#093;</code> (number, <code>&quot;auto&quot;</code>, <code>&quot;fill&quot;</code>, <code>&quot;free&quot;</code>)
							<blockquote>
								<p>
									Height of the element, in pixels, or
								</p>
								<blockquote>
									<ul>
										<li style="list-style-type: none">
											<code>&quot;auto&quot;</code> - Reserves the minimum required
										</li>
										<li style="list-style-type: none">
											<code>&quot;free&quot;</code> - Allows the element's height to grow to any size.
										</li>
										<li style="list-style-type: none">
											<code>&quot;fill&quot;</code> - To fill up the height that other elements in the
											same group have claimed, without claiming more.
										</li>
									</ul>
								</blockquote>
								<p>
									This attribute can be controlled using the <code>height</code> style
									property.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Hilite &#091;SG&#093;</code> (boolean)
							<blockquote>
								<p>
									If <strong>true</strong>, the element is in highlighted state. This
									state variable is handled by the <a href="#tek.ui.class.widget">Widget</a> 
									class.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>MaxHeight &#091;IG&#093;</code> (number or <code>&quot;none&quot;</code>)
							<blockquote>
								<p>
									Maximum height of the element, in pixels &#091;default: <code>&quot;none&quot;</code>&#093;.
									This attribute is controllable via the <code>max-height</code> style
									property.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>MaxWidth &#091;IG&#093;</code> (number or <code>&quot;none&quot;</code>)
							<blockquote>
								<p>
									Maximum width of the element, in pixels &#091;default: <code>&quot;none&quot;</code>&#093;.
									This attribute is controllable via the <code>max-width</code> style
									property.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>MinHeight &#091;IG&#093;</code> (number)
							<blockquote>
								<p>
									Minimum height of the element, in pixels &#091;default: <code>0</code>&#093;.
									This attribute is controllable via the <code>min-height</code> style
									property.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>MinWidth &#091;IG&#093;</code> (number)
							<blockquote>
								<p>
									Minimum width of the element, in pixels &#091;default: <code>0</code>&#093;.
									This attribute is controllable via the <code>min-width</code> style
									property.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Selected &#091;ISG&#093;</code> (boolean)
							<blockquote>
								<p>
									If <strong>true</strong>, the element is in selected state. This state
									variable is handled by the <a href="#tek.ui.class.widget">Widget</a> class.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>TrackDamage &#091;I&#093;</code> (boolean)
							<blockquote>
								<p>
									If <strong>true</strong>, the element collects intra-area damages in a
									<a href="#tek.lib.region">Region</a> named <code>DamageRegion</code>, which can be
									used by class writers to implement minimally invasive repaints.
									Default: <strong>false</strong>, the element is repainted in its entirety.
									The boolean will be translated to the flag <code>FL_TRACKDAMAGE</code> and
									is meaningless after initialization.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>VAlign &#091;IG&#093;</code> (<code>&quot;top&quot;</code>, <code>&quot;center&quot;</code>, <code>&quot;bottom&quot;</code>)
							<blockquote>
								<p>
									Vertical alignment of the element in its group. This attribute
									can be controlled using the <code>valign</code> style property.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Weight &#091;IG&#093;</code> (number)
							<blockquote>
								<p>
									Specifies the weight that is attributed to the element relative
									to its siblings in the same group. By recommendation, the weights
									in a group should sum up to 0x10000.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Width &#091;IG&#093;</code> (number, <code>&quot;auto&quot;</code>, <code>&quot;fill&quot;</code>, <code>&quot;free&quot;</code>)
							<blockquote>
								<p>
									Width of the element, in pixels, or
								</p>
								<blockquote>
									<ul>
										<li style="list-style-type: none">
											<code>&quot;auto&quot;</code> - Reserves the minimum required
										</li>
										<li style="list-style-type: none">
											<code>&quot;free&quot;</code> - Allows the element's width to grow to any size
										</li>
										<li style="list-style-type: none">
											<code>&quot;fill&quot;</code> - To fill up the width that other elements in the
											same group have claimed, without claiming more.
										</li>
									</ul>
								</blockquote>
								<p>
									This attribute can be controlled using the <code>width</code> style
									property.
								</p>
							</blockquote>
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>STYLE PROPERTIES</dfn>
				<blockquote>
					<table>
						<tr>
							<td class="column1">
								<em>background-attachment</em> 
							</td>
							<td class="column2">
								<code>&quot;scollable&quot;</code> or <code>&quot;fixed&quot;</code> 
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>background-color</em> 
							</td>
							<td class="column2">
								Controls <code>Area.BGPen</code> 
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>fixed</em> 
							</td>
							<td class="column2">
								coordinates used by the fixed layouter: <code>&quot;x0 y0 x1 y1&quot;</code> 
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>halign</em> 
							</td>
							<td class="column2">
								controls the <code>Area.HAlign</code> attribute
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>height</em> 
							</td>
							<td class="column2">
								controls the <code>Area.Height</code> attribute
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>margin-bottom</em> 
							</td>
							<td class="column2">
								the element's bottom margin, in pixels
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>margin-left</em> 
							</td>
							<td class="column2">
								the element's left margin, in pixels
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>margin-right</em> 
							</td>
							<td class="column2">
								the element's right margin, in pixels
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>margin-top</em> 
							</td>
							<td class="column2">
								the element's top margin, in pixels
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>max-height</em> 
							</td>
							<td class="column2">
								controls the <code>Area.MaxHeight</code> attribute
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>max-width</em> 
							</td>
							<td class="column2">
								controls the <code>Area.MaxWidth</code> attribute
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>min-height</em> 
							</td>
							<td class="column2">
								controls the <code>Area.MinHeight</code> attribute
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>min-width</em> 
							</td>
							<td class="column2">
								controls the <code>Area.MinWidth</code> attribute
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>padding-bottom</em> 
							</td>
							<td class="column2">
								the element's bottom padding
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>padding-left</em> 
							</td>
							<td class="column2">
								the element's left padding
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>padding-right</em> 
							</td>
							<td class="column2">
								the element's right padding
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>padding-top</em> 
							</td>
							<td class="column2">
								the element's top padding
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>valign</em> 
							</td>
							<td class="column2">
								controls the <code>Area.VAlign</code> attribute
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>width</em> 
							</td>
							<td class="column2">
								controls the <code>Area.Width</code> attribute
							</td>
						</tr>
					</table>
					<p>
						Note that repainting elements with a <code>&quot;fixed&quot;</code> 
						<em>background-attachment</em> can be expensive. This variant should be
						used sparingly, and some classes may implement it incompletely or
						incorrectly.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>IMPLEMENTS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Area:askMinMax"><code>Area:askMinMax()</code></a> - Queries the element's minimum and maximum size
						</li>
						<li style="list-style-type: none">
							<a href="#Area:checkClearFlags"><code>Area:checkClearFlags()</code></a> - Check and clear an element's flags
						</li>
						<li style="list-style-type: none">
							<a href="#Area:checkFlags"><code>Area:checkFlags()</code></a> - Check an element's flags
						</li>
						<li style="list-style-type: none">
							<a href="#Area:checkFocus"><code>Area:checkFocus()</code></a> - Checks if the element can receive the input focus
						</li>
						<li style="list-style-type: none">
							<a href="#Area:checkHilite"><code>Area:checkHilite()</code></a> - Checks if the element can be highlighted
						</li>
						<li style="list-style-type: none">
							<a href="#Area:damage"><code>Area:damage()</code></a> - Notifies the element of a damage
						</li>
						<li style="list-style-type: none">
							<a href="#Area:draw"><code>Area:draw()</code></a> - Paints the element
						</li>
						<li style="list-style-type: none">
							<a href="#Area:drawBegin"><code>Area:drawBegin()</code></a> - Prepares the rendering context
						</li>
						<li style="list-style-type: none">
							<a href="#Area:drawEnd"><code>Area:drawEnd()</code></a> - Reverts the changes made in <a href="#drawBegin"><code>drawBegin()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:erase"><code>Area:erase()</code></a> - Erases the element's background
						</li>
						<li style="list-style-type: none">
							<a href="#Area:focusRect"><code>Area:focusRect()</code></a> - Makes the element fully visible, if possible
						</li>
						<li style="list-style-type: none">
							<a href="#Area:getBG"><code>Area:getBG()</code></a> - Gets the element's background properties
						</li>
						<li style="list-style-type: none">
							<a href="#Area:getBGElement"><code>Area:getBGElement()</code></a> - Gets the element's background element
						</li>
						<li style="list-style-type: none">
							<a href="#Area:getByXY"><code>Area:getByXY()</code></a> - Checks if the element covers a coordinate
						</li>
						<li style="list-style-type: none">
							<a href="#Area:getChildren"><code>Area:getChildren()</code></a> - Gets the element's children
						</li>
						<li style="list-style-type: none">
							<a href="#Area:getDisplacement"><code>Area:getDisplacement()</code></a>: Get this element's coordinate displacement
						</li>
						<li style="list-style-type: none">
							<a href="#Area:getGroup"><code>Area:getGroup()</code></a> - Gets the element's group
						</li>
						<li style="list-style-type: none">
							<a href="#Area:getMargin"><code>Area:getMargin()</code></a> - Gets the element's margin
						</li>
						<li style="list-style-type: none">
							<a href="#Area:getMinMax"><code>Area:getMinMax()</code></a> - Gets the element's calculated min/max sizes
						</li>
						<li style="list-style-type: none">
							<a href="#Area:getMsgFields"><code>Area:getMsgFields()</code></a> - Get fields of an input message
						</li>
						<li style="list-style-type: none">
							<a href="#Area:getNext"><code>Area:getNext()</code></a> - Gets the element's successor in its group
						</li>
						<li style="list-style-type: none">
							<a href="#Area:getPadding"><code>Area:getPadding()</code></a> - Gets the element's paddings
						</li>
						<li style="list-style-type: none">
							<a href="#Area:getParent"><code>Area:getParent()</code></a> - Gets the element's parent element
						</li>
						<li style="list-style-type: none">
							<a href="#Area:getPrev"><code>Area:getPrev()</code></a> - Gets the element's predecessor in its group
						</li>
						<li style="list-style-type: none">
							<a href="#Area:getRect"><code>Area:getRect()</code></a> - Returns the element's layouted coordinates
						</li>
						<li style="list-style-type: none">
							<a href="#Area:getSiblings"><code>Area:getSiblings()</code></a> - Gets the element's siblings
						</li>
						<li style="list-style-type: none">
							<a href="#Area:hide"><code>Area:hide()</code></a> - Gets called when the element is about to be hidden
						</li>
						<li style="list-style-type: none">
							<a href="#Area:layout"><code>Area:layout()</code></a> - Layouts the element into a rectangle
						</li>
						<li style="list-style-type: none">
							<a href="#Area:passMsg"><code>Area:passMsg()</code></a> - Passes an input message to the element
						</li>
						<li style="list-style-type: none">
							<a href="#Area:punch"><code>Area:punch()</code></a> - Subtracts the outline of the element from a
							<a href="#tek.lib.region">Region</a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:rethinkLayout"><code>Area:rethinkLayout()</code></a> - Causes a relayout of the element and its group
						</li>
						<li style="list-style-type: none">
							<a href="#Area:setFlags"><code>Area:setFlags()</code></a> - Sets an element's flags
						</li>
						<li style="list-style-type: none">
							<a href="#Area:setState"><code>Area:setState()</code></a> - Sets the background attribute of an element
						</li>
						<li style="list-style-type: none">
							<a href="#Area:show"><code>Area:show()</code></a> - Gets called when the element is about to be shown
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>OVERRIDES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Element:cleanup"><code>Element:cleanup()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Object:init"><code>Object.init()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Class:new"><code>Class.new()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:onSetStyle"><code>Element:onSetStyle()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:setup"><code>Element:setup()</code></a> 
						</li>
					</ul>
				</blockquote>
				<hr />
			</div>
		</div>
		<div class="node"><h3><a name="Area:askMinMax" id="Area:askMinMax"><code>minw, minh, maxw, maxh = Area:askMinMax(minw, minh, maxw, maxh)</code></a></h3>
			<p>
				This
				method is called during the layouting process for adding the required
				width and height to the minimum and maximum size requirements of the
				element, before passing the result on to its super class. <code>minw</code>,
				<code>minh</code> are cumulative of the minimal size of the element, while
				<code>maxw</code>, <code>maxw</code> collect the size the element is allowed to expand to.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Area:beginPopup" id="Area:beginPopup"><code>beginPopup([baseitem])</code></a></h3>
			<p>
				Prepare element for being used in a popup.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Area:checkClearFlags" id="Area:checkClearFlags"><code>all_present = Area:checkClearFlags(chkflags[, clearflags])</code></a></h3>
			<p>
				Check for
				presence of all of the specified <code>chkflags</code> in the element. Optionally
				clears the <code>clearflags</code> set from the element.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Area:checkFlags" id="Area:checkFlags"><code>all_present = Area:checkFlags(flags)</code></a></h3>
			<p>
				Check for presence of all of the
				specified <code>flags</code> in the element.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Area:checkFocus" id="Area:checkFocus"><code>can_receive = Area:checkFocus()</code></a></h3>
			<p>
				Returns <strong>true</strong> if this element can
				receive the input focus.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Area:checkHilite" id="Area:checkHilite"><code>can_hilite = Area:checkHilite()</code></a></h3>
			<p>
				Returns <strong>true</strong> if this element can
				be highlighted, e.g by being hovered over with the pointing device.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Area:cleanup" id="Area:cleanup"><code>Area:cleanup()</code></a></h3>
			<p>
				Clears all temporary layouting data and the <code>FL_LAYOUT</code> 
				and <code>FL_SETUP</code> flags, before passing on the call to <a href="#Element:cleanup"><code>Element:cleanup()</code></a>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Area:damage" id="Area:damage"><code>Area:damage(x0, y0, x1, y1)</code></a></h3>
			<p>
				If the element overlaps with the given
				rectangle, this function marks it as damaged by setting <code>ui.FL_REDRAW</code> 
				in the element's <code>Flag</code> field. Additionally, if the element's
				<code>FL_TRACKDAMAGE</code> flag is set, intra-area damage rectangles are
				collected in <code>DamageRegion</code>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Area:draw" id="Area:draw"><code>success = Area:draw()</code></a></h3>
			<p>
				If the element is marked for a repaint (indicated
				by the presence of the flag <code>ui.FL_REDRAW</code> in the <code>Flags</code> field),
				draws the element into the rectangle that was assigned to it by the
				layouter, clears <code>ui.FL_REDRAW</code>, and returns <strong>true</strong>. If the
				flag <code>FL_ERASEBG</code> is set, this function also clears the element's
				background by calling <a href="#Area:erase"><code>Area:erase()</code></a>.
			</p>
			<p>
				When overriding this function, the control flow is roughly as follows:
			</p>
<pre>
function ElementClass:draw()
  if SuperClass.draw(self) then
    -- your rendering here
    return true
  end
end
</pre>
			<p>
				There are rare occasions in which a class modifies the drawing context,
				e.g. by setting a coordinate displacement. Such modifications must
				be performed in <a href="#Area:drawBegin"><code>Area:drawBegin()</code></a> and undone in <a href="#Area:drawEnd"><code>Area:drawEnd()</code></a>. In this
				case, the control flow looks like this:
			</p>
<pre>
function ElementClass:draw()
  if SuperClass.draw(self) and self:drawBegin() then
    -- your rendering here
    self:drawEnd()
    return true
  end
end
</pre>
			<hr />
		</div>
		<div class="node"><h3><a name="Area:drawBegin" id="Area:drawBegin"><code>can_draw = Area:drawBegin()</code></a></h3>
			<p>
				Prepares the drawing context, returning a
				boolean indicating success. This function must be overridden if a class
				wishes to modify the drawing context, e.g. for installing a coordinate
				displacement.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Area:drawEnd" id="Area:drawEnd"><code>Area:drawEnd()</code></a></h3>
			<p>
				Reverts the changes made to the drawing context during
				<a href="#Area:drawBegin"><code>Area:drawBegin()</code></a>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Area:erase" id="Area:erase"><code>Area:erase()</code></a></h3>
			<p>
				Clears the element's background. This method is invoked by
				<a href="#Area:draw"><code>Area:draw()</code></a> if the <code>FL_ERASEBG</code> flag is set, and when a repaint is
				possible and necessary. <a href="#Area:drawBegin"><code>Area:drawBegin()</code></a> has been invoked when this
				function is called, and <a href="#Area:drawEnd"><code>Area:drawEnd()</code></a> will be called afterwards.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Area:focusRect" id="Area:focusRect"><code>moved = Area:focusRect([x0, y0, x1, y1])</code></a></h3>
			<p>
				Tries to shift any Canvas
				containing the element into a position that makes the element fully
				visible. Optionally, a rectangle can be specified that is to be made
				visible. Returns <strong>true</strong> to indicate that some kind of repositioning
				has taken place.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Area:getBG" id="Area:getBG"><code>bgpen, tx, ty, pos_independent = Area:getBG()</code></a></h3>
			<p>
				Gets the element's
				background properties. <code>bgpen</code> is the background paint (which may be a
				solid color, texture, or gradient). If the element's
				<em>background-attachment</em> is not <code>&quot;fixed&quot;</code>, then <code>tx</code> and <code>ty</code> are
				the coordinates of the texture origin. <code>pos_independent</code> indicates
				whether the background is independent of the element's position.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Area:getBGElement" id="Area:getBGElement"><code>element = Area:getBGElement()</code></a></h3>
			<p>
				Returns the element that is responsible for
				painting the surroundings (or the background) of the element. This
				information is useful for painting transparent or translucent parts of
				the element, e.g. an inactive focus border.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Area:getByXY" id="Area:getByXY"><code>self = Area:getByXY(x, y)</code></a></h3>
			<p>
				Returns <code>self</code> if the element covers
				the specified coordinate.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Area:getChildren" id="Area:getChildren"><code>element = Area:getChildren([mode])</code></a></h3>
			<p>
				Returns a table containing the
				element's children, or <strong>nil</strong> if this element cannot have children.
				The optional argument <code>mode</code> is the string <code>&quot;init&quot;</code> when this function
				is called during initialization or deinitialization.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Area:getDisplacement" id="Area:getDisplacement"><code>dx, dy = Area:getDisplacement()</code></a></h3>
			<p>
				Get the element's coordinate displacement
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Area:getGroup" id="Area:getGroup"><code>element = Area:getGroup(parent)</code></a></h3>
			<p>
				Returns the closest
				<a href="#tek.ui.class.group">Group</a> containing the element. If the <code>parent</code> 
				argument is <strong>true</strong>, this function will start looking for the closest
				group at its parent - otherwise, the element itself is returned if it is
				a group already. Returns <strong>nil</strong> if the element is not currently
				connected.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Area:getMargin" id="Area:getMargin"><code>left, top, right, bottom = Area:getMargin()</code></a></h3>
			<p>
				Returns the element's
				margins in the order left, top, right, bottom.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Area:getMinMax" id="Area:getMinMax"><code>minx, miny, maxx, maxy = Area:getMinMax()</code></a></h3>
			<p>
				Returns the element's
				calculated minimum and maximum size requirements, which are available
				after <a href="#Area:askMinMax"><code>Area:askMinMax()</code></a>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Area:getNext" id="Area:getNext"><code>element = Area:getNext([mode])</code></a></h3>
			<p>
				Returns the next element in its group.
				If the element has no successor and the optional argument <code>mode</code> is
				<code>&quot;recursive&quot;</code>, returns the next element in the parent group (and so
				forth, until it reaches the topmost group).
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Area:getPadding" id="Area:getPadding"><code>left, top, right, bottom = Area:getPadding()</code></a></h3>
			<p>
				Returns the element's
				padding style properties.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Area:getParent" id="Area:getParent"><code>element = Area:getParent()</code></a></h3>
			<p>
				Returns the element's parent element, or
				<strong>false</strong> if it currently has no parent.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Area:getPrev" id="Area:getPrev"><code>element = Area:getPrev([mode])</code></a></h3>
			<p>
				Returns the previous element in its group.
				If the element has no predecessor and the optional argument <code>mode</code> is
				<code>&quot;recursive&quot;</code>, returns the previous element in the parent group (and so
				forth, until it reaches the topmost group).
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Area:getRect" id="Area:getRect"><code>x0, y0, x1, y1 = Area:getRect()</code></a></h3>
			<p>
				This function returns the
				rectangle which the element has been layouted to, or <strong>nil</strong> 
				if the element has not been layouted yet.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Area:getSiblings" id="Area:getSiblings"><code>table = Area:getSiblings()</code></a></h3>
			<p>
				Returns a table containing the element's
				siblings, which includes the element itself. Returns <strong>nil</strong> if the
				element is not currently connected. Note: The returned table must be
				treated read-only.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Area:hide" id="Area:hide"><code>Area:hide()</code></a></h3>
			<p>
				Override this method to free all display-related resources
				previously allocated in <a href="#Area:show"><code>Area:show()</code></a>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Area:layout" id="Area:layout"><code>changed = Area:layout(x0, y0, x1, y1[, markdamage])</code></a></h3>
			<p>
				Layouts the element
				into the specified rectangle. If the element's (or any of its childrens')
				coordinates change, returns <strong>true</strong> and marks the element as damaged,
				unless the optional argument <code>markdamage</code> is set to <strong>false</strong>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Area:passMsg" id="Area:passMsg"><code>msg = Area:passMsg(msg)</code></a></h3>
			<p>
				If the element has the ui.FL_RECVINPUT flag set,
				this function receives input messages. Additionally, to receive messages
				of the type ui.MSG_MOUSEMOVE, the flag ui.FL_RECVMOUSEMOVE must be set.
				After processing, it is free to return the message unmodified (thus
				allowing it to be passed on to other elements), or to absorb the message
				by returning <strong>false</strong>. You are not allowed to modify any data
				inside the original message; if you alter it, you must return a copy.
				The message types ui.MSG_INTERVAL, ui.MSG_USER, and ui.MSG_REQSELECTION
				are not received by this function. To receive these, you must register an
				input handler using <a href="#Window:addInputHandler"><code>Window:addInputHandler()</code></a>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Area:punch" id="Area:punch"><code>Area:punch(region)</code></a></h3>
			<p>
				Subtracts the element from (by punching a hole into)
				the specified Region. This function is called by the layouter.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Area:rethinkLayout" id="Area:rethinkLayout"><code>Area:rethinkLayout([repaint[, check_size]])</code></a></h3>
			<p>
				Slates an element (and its
				children) for relayouting, which takes place during the next Window update
				cycle. If the element's coordinates change, this will cause it to be
				repainted. The parent element (usually a Group) will be checked as well,
				so that it has the opportunity to update its FreeRegion.
				The optional argument <code>repaint</code> can be used to specify additional hints:
			</p>
			<blockquote>
				<ul>
					<li style="list-style-type: none">
						<code>1</code> - marks the element for repainting unconditionally (not
						implying possible children)
					</li>
					<li style="list-style-type: none">
						<code>2</code> - marks the element (and all possible children) for repainting
						unconditionally
					</li>
				</ul>
			</blockquote>
			<p>
				The optional argument <code>check_size</code> (a boolean) can be used to
				recalculate the element's minimum and maximum size requirements.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Area:setFlags" id="Area:setFlags"><code>setFlags(flags)</code></a></h3>
			<p>
				Set element's flags. The flags <code>FL_REDRAW</code>,
				<code>FL_CHANGED</code>, and <code>FL_REDRAWBORDER</code> will additionally cause the flag
				<code>FL_UPDATE</code> to be set, which will also bubble up in the element
				hierarchy until it reaches to topmost element.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Area:setState" id="Area:setState"><code>Area:setState(bg)</code></a></h3>
			<p>
				Sets the <code>BGPen</code> attribute according to
				the state of the element, and if it changed, marks the element
				for repainting.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Area:setup" id="Area:setup"><code>Area:setup(app, win)</code></a></h3>
			<p>
				After passing the call on to <a href="#Element:setup"><code>Element:setup()</code></a>,
				initializes fields which are being used by <a href="#Area:layout"><code>Area:layout()</code></a>, and sets
				<code>FL_SETUP</code> in the <code>Flags</code> field to indicate that the element is
				ready for getting layouted and displayed.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Area:show" id="Area:show"><code>Area:show()</code></a></h3>
			<p>
				This function is called when the element's window is opened.
			</p>
			<hr class="page-break" />
		</div>
		<div class="node"><h2><a name="tek.ui.class.button" id="tek.ui.class.button">Button (v2.1)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> :
						<a href="#tek.class">Class</a> /
						<a href="#tek.class.object">Object</a> /
						<a href="#tek.ui.class.element">Element</a> /
						<a href="#tek.ui.class.area">Area</a> /
						<a href="#tek.ui.class.frame">Frame</a> /
						<a href="#tek.ui.class.widget">Widget</a> /
						<a href="#tek.ui.class.text">Text</a> /
						Button 
					</p>
					<p>
						The Button class implements a Text element with a <em>button mode</em> 
						(behavior) and <em>button class</em> (appearance). In addition to that,
						it enables the initialization of a possible keyboard shortcut from
						a special initiatory character (by default an underscore) preceding
						a letter in the element's <code>Text</code> attribute.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>NOTES</dfn>
				<blockquote>
					<p>
						This class adds redundancy, because it differs from the
						<a href="#tek.ui.class.text">Text</a> class only in that it initializes a few
						defaults differently in its <code>new()</code> method. To avoid this overhead,
						use the Text class directly, or create a <em>Button factory</em> like this:
					</p>
<pre>
function newButton(text)
  return ui.Text:new { Mode = &quot;button&quot;, Class = &quot;button&quot;,
    Text = text, KeyCode = true }
end
</pre>
				</blockquote>
				<hr class="page-break" />
			</div>
		</div>
		<div class="node"><h2><a name="tek.ui.class.canvas" id="tek.ui.class.canvas">Canvas (v37.6)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> :
						<a href="#tek.class">Class</a> /
						<a href="#tek.class.object">Object</a> /
						<a href="#tek.ui.class.element">Element</a> /
						<a href="#tek.ui.class.area">Area</a> /
						<a href="#tek.ui.class.area">Frame</a> /
						Canvas 
					</p>
					<p>
						This class implements a scrollable area acting as a managing container
						for a child element. Currently, this class is used exclusively for
						child objects of the <a href="#tek.ui.class.scrollgroup">ScrollGroup</a> class.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>ATTRIBUTES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<code>AutoPosition &#091;I&#093;</code> (boolean)
							<blockquote>
								<p>
									See <a href="#tek.ui.class.area">Area</a> 
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>AutoHeight &#091;IG&#093;</code> (boolean)
							<blockquote>
								<p>
									The height of the canvas is automatically adapted to the height
									of the region it is layouted into. Default: <strong>false</strong> 
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>AutoWidth &#091;IG&#093;</code> (boolean)
							<blockquote>
								<p>
									The width of the canvas is automatically adapted to the width
									of the canvas it is layouted into. Default: <strong>false</strong> 
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>CanvasHeight &#091;ISG&#093;</code> (number)
							<blockquote>
								<p>
									The height of the canvas in pixels
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>CanvasLeft &#091;ISG&#093;</code> (number)
							<blockquote>
								<p>
									Left visible offset of the canvas in pixels
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>CanvasTop &#091;ISG&#093;</code> (number)
							<blockquote>
								<p>
									Top visible offset of the canvas in pixels
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>CanvasWidth &#091;ISG&#093;</code> (number)
							<blockquote>
								<p>
									The width of the canvas in pixels
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Child &#091;ISG&#093;</code> (object)
							<blockquote>
								<p>
									The child element being managed by the Canvas
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>KeepMinHeight &#091;I&#093;</code> (boolean)
							<blockquote>
								<p>
									Report the minimum height of the Canvas' child object as the
									Canvas' minimum display height. The boolean will be translated
									to the flag <code>FL_KEEPMINHEIGHT</code>, and is meaningless after
									initialization.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>KeepMinWidth &#091;I&#093;</code> (boolean)
							<blockquote>
								<p>
									Translates to the flag <code>FL_KEEPMINWIDTH</code>. See also
									<code>KeepMinHeight</code>, above.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>UnusedRegion &#091;G&#093;</code> (<a href="#tek.lib.region">Region</a>)
							<blockquote>
								<p>
									Region of the Canvas which is not covered by its <code>Child</code> 
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>UseChildBG &#091;IG&#093;</code> (boolean)
							<blockquote>
								<p>
									If <strong>true</strong>, the Canvas borrows its background properties from
									its child for rendering its <code>UnusedRegion</code>. If <strong>false</strong>,
									the Canvas' own background properties are used. Default: <strong>true</strong> 
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>VIncrement &#091;IG&#093;</code> (number)
							<blockquote>
								<p>
									Vertical scroll step, used e.g. for mouse wheels
								</p>
							</blockquote>
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>IMPLEMENTS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Canvas:damageChild"><code>Canvas:damageChild()</code></a> - Damages a child object where it is visible
						</li>
						<li style="list-style-type: none">
							<a href="#Canvas:onSetChild"><code>Canvas:onSetChild()</code></a> - Handler called when <code>Child</code> is set
						</li>
						<li style="list-style-type: none">
							<a href="#Canvas:updateUnusedRegion"><code>Canvas:updateUnusedRegion()</code></a> - Updates region not covered by Child
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>OVERRIDES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Object:addClassNotifications"><code>Object.addClassNotifications()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:askMinMax"><code>Area:askMinMax()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:cleanup"><code>Element:cleanup()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:connect"><code>Element:connect()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:damage"><code>Area:damage()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:decodeProperties"><code>Element:decodeProperties()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:disconnect"><code>Element:disconnect()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:draw"><code>Area:draw()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:drawBegin"><code>Area:drawBegin()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:drawEnd"><code>Area:drawEnd()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:erase"><code>Element:erase()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:focusRect"><code>Area:focusRect()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:getBG"><code>Area:getBG()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:getBGElement"><code>Area:getBGElement()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:getByXY"><code>Area:getByXY()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:getChildren"><code>Area:getChildren()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:getDisplacement"><code>Area:getDisplacement()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:hide"><code>Area:hide()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:layout"><code>Area:layout()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Class:new"><code>Class.new()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:passMsg"><code>Area:passMsg()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:setup"><code>Element:setup()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:show"><code>Area:show()</code></a> 
						</li>
					</ul>
				</blockquote>
				<hr />
			</div>
		</div>
		<div class="node"><h3><a name="Canvas:damageChild" id="Canvas:damageChild"><code>damageChild(r1, r2, r3, r4)</code></a></h3>
			<p>
				Damages the specified region in the
				child area where it overlaps with the visible part of the canvas.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Canvas:getMouseOver" id="Canvas:getMouseOver"><code>over, x, y = getMouseOver(msg)</code></a></h3>
			<p>
				From an input message, retrieves the mouse
				position as seen from the child object. The first return value is
				<strong>false</strong>, <code>&quot;child&quot;</code> if the mouse is over the child object, or
				<code>&quot;canvas&quot;</code> if the mouse is over the canvas.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Canvas:onSetChild" id="Canvas:onSetChild"><code>Canvas:onSetChild()</code></a></h3>
			<p>
				This handler is invoked when the canvas'
				<code>Child</code> element has changed.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Canvas:updateUnusedRegion" id="Canvas:updateUnusedRegion"><code>updateUnusedRegion()</code></a></h3>
			<p>
				Updates the <code>UnusedRegion</code> attribute, which
				contains the Canvas' area which isn't covered by its <code>Child</code>.
			</p>
			<hr class="page-break" />
		</div>
		<div class="node"><h2><a name="tek.ui.class.checkmark" id="tek.ui.class.checkmark">CheckMark (v9.4)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> :
						<a href="#tek.class">Class</a> /
						<a href="#tek.class.object">Object</a> /
						<a href="#tek.ui.class.element">Element</a> /
						<a href="#tek.ui.class.area">Area</a> /
						<a href="#tek.ui.class.frame">Frame</a> /
						<a href="#tek.ui.class.widget">Widget</a> /
						<a href="#tek.ui.class.text">Text</a> /
						CheckMark / <select onchange="if (this.value != '') window.location.href = this.value; this.selectedIndex = 0;"><option value="">1 subclasses</option><option value="#tek.ui.class.radiobutton">RadioButton</option></select>
					</p>
					<p>
						Specialization of the <a href="#tek.ui.class.text">Text</a> class,
						implementing a toggle button with a graphical check mark.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>ATTRIBUTES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<code>Image &#091;IG&#093;</code> (<a href="#tek.ui.class.image">Image</a>)
							<blockquote>
								<p>
									Image to be displayed when the CheckMark element is unselected.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>SelectImage &#091;IG&#093;</code> (<a href="#tek.ui.class.image">Image</a>)
							<blockquote>
								<p>
									Image to be displayed when the CheckMark element is selected.
								</p>
							</blockquote>
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>OVERRIDES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Area:askMinMax"><code>Area:askMinMax()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:draw"><code>Area:draw()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:layout"><code>Area:layout()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Class:new"><code>Class.new()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:setState"><code>Area:setState()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:show"><code>Area:show()</code></a> 
						</li>
					</ul>
				</blockquote>
				<hr class="page-break" />
			</div>
		</div>
		<div class="node"><h2><a name="tek.ui.class.dirlist" id="tek.ui.class.dirlist">DirList (v17.5)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> :
						<a href="#tek.class">Class</a> /
						<a href="#tek.class.object">Object</a> /
						<a href="#tek.ui.class.element">Element</a> /
						<a href="#tek.ui.class.area">Area</a> /
						<a href="#tek.ui.class.frame">Frame</a> /
						<a href="#tek.ui.class.widget">Widget</a> /
						<a href="#tek.ui.class.group">Group</a> /
						DirList 
					</p>
					<p>
						This class implements a directory lister.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>ATTRIBUTES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<code>AutoWidth &#091;IG&#093;</code> (boolean)
							<blockquote>
								<p>
									Tells the directory lister to adapt its contents dynamically to
									the width of the element. By default, the column widths remain
									adjusted to the initial width.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>DisplayMode &#091;IG&#093;</code> (string)
							<blockquote>
								<p>
									What kind of entries to display, <code>&quot;all&quot;</code> or <code>&quot;onlydirs&quot;</code>.
									Default: <code>&quot;all&quot;</code> 
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>FocusElement &#091;I&#093;</code> (string)
							<blockquote>
								<p>
									What element to focus initially: <code>&quot;path&quot;</code>, <code>&quot;location&quot;</code>,
									<code>&quot;list&quot;</code>. Default: <code>&quot;list&quot;</code> 
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Kind &#091;IG&#093;</code> (string)
							<blockquote>
								<p>
									The visual appearance (or purpose) of the lister, which will
									determine the presence and arrangement of some interface elements:
								</p>
								<blockquote>
									<ul>
										<li>
											<code>&quot;requester&quot;</code> - for a standalone file requester
										</li>
										<li>
											<code>&quot;lister&quot;</code> - for a directory lister component
										</li>
										<li>
											<code>&quot;simple&quot;</code> - for the use without accompanying elements
										</li>
									</ul>
								</blockquote>
								<p>
									The default kind is <code>&quot;lister&quot;</code>.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Location &#091;IG&#093;</code> (string)
							<blockquote>
								<p>
									The currently selected entry (may be a file or directory)
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Path &#091;IG&#093;</code> (string)
							<blockquote>
								<p>
									Directory in the file system
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>BasePath</code> (string)
							<blockquote>
								<p>
									Filesystem base path in which the lister is allowed to operate
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Selection &#091;G&#093;</code> (table)
							<blockquote>
								<p>
									An array of selected entries
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>SelectMode &#091;IG&#093;</code> (String)
							<blockquote>
								<p>
									Selection mode:
								</p>
								<blockquote>
									<ul>
										<li style="list-style-type: none">
											<code>&quot;single&quot;</code> - allows selections of one entry at a time
										</li>
										<li style="list-style-type: none">
											<code>&quot;multi&quot;</code> - allows selections of multiple entries
										</li>
									</ul>
								</blockquote>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>SelectText &#091;IG&#093;</code> (String)
							<blockquote>
								<p>
									The text to display on the selection button. Default: <code>&quot;Open&quot;</code> 
									(or its equivalent in the current locale)
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Status &#091;G&#093;</code> (string)
							<blockquote>
								<p>
									Status of the directory lister:
								</p>
								<blockquote>
									<ul>
										<li style="list-style-type: none">
											<code>&quot;running&quot;</code> - the lister is currently being shown
										</li>
										<li style="list-style-type: none">
											<code>&quot;selected&quot;</code> - the user has selected one or more entries
										</li>
										<li style="list-style-type: none">
											<code>&quot;cancelled&quot;</code> - the lister has been cancelled by the user
										</li>
									</ul>
								</blockquote>
							</blockquote>
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>IMPLEMENTS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#DirList:abortScan"><code>DirList:abortScan()</code></a> - Aborts scanning
						</li>
						<li style="list-style-type: none">
							<a href="#DirList:getCurrentDir"><code>DirList:getCurrentDir()</code></a> - Gets the current directory
						</li>
						<li style="list-style-type: none">
							<a href="#DirList:getDirIterator"><code>DirList:getDirIterator()</code></a> - Gets an iterator over a directory
						</li>
						<li style="list-style-type: none">
							<a href="#DirList:getFileStat"><code>DirList:getFileStat()</code></a> - Examines a file entry
						</li>
						<li style="list-style-type: none">
							<a href="#DirList:goParent"><code>DirList:goParent()</code></a> - Goes to the parent of the current directory
						</li>
						<li style="list-style-type: none">
							<a href="#DirList:onSelectEntry"><code>DirList:onSelectEntry()</code></a> - Handler invoked on selection of an entry
						</li>
						<li style="list-style-type: none">
							<a href="#DirList:showDirectory"><code>DirList:showDirectory()</code></a> - Reads and shows a directory
						</li>
						<li style="list-style-type: none">
							<a href="#DirList:scanEntry"><code>DirList:scanEntry()</code></a> - Scans a single entry in a directory
						</li>
						<li style="list-style-type: none">
							<a href="#DirList:showDirectory"><code>DirList:showDirectory()</code></a> - Starts scanning and displays a directory
						</li>
						<li style="list-style-type: none">
							<a href="#DirList:splitPath"><code>DirList:splitPath()</code></a> - Splits a filename
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>OVERRIDES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Class:new"><code>Class.new()</code></a> 
						</li>
					</ul>
				</blockquote>
				<hr />
			</div>
		</div>
		<div class="node"><h3><a name="DirList:abortScan" id="DirList:abortScan"><code>abortScan()</code></a></h3>
			<p>
				This function aborts the coroutine which is
				currently scanning the directory. The caller of this function must
				be running in its own coroutine.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="DirList:getCurrentDir" id="DirList:getCurrentDir"><code>cdir = getCurrentDir()</code></a></h3>
			<p>
				Returns the current directory. You can override
				this function to implement your own filesystem semantics.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="DirList:getDirIterator" id="DirList:getDirIterator"><code>iterator = getDirIterator(directory)</code></a></h3>
			<p>
				Returns an iterator function for
				traversal of the entries in the given <code>directory</code>. You can override this
				function to get an iterator over arbitrary kinds of listings.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="DirList:getFileStat" id="DirList:getFileStat"><code>attr = getFileStat(path, name, attr[, idx])</code></a></h3>
			<p>
				Returns an attribute for the
				entry of the given <code>path</code> and <code>name</code>; see the documentation of the
				LuaFileSystem module for the attribute names and their meanings.
				Currently, only the <code>&quot;mode&quot;</code> and <code>&quot;size&quot;</code> attributes are requested,
				but if you override this function, it would be smart to implement as many
				attributes as possible. <code>idx</code> is optional and specifies the entry number
				inside the list, which is an information that may or may not be supplied
				by the calling function.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="DirList:goParent" id="DirList:goParent"><code>goParent()</code></a></h3>
			<p>
				Starts reading and displays the parent directory of the
				current directory.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="DirList:onSelectEntry" id="DirList:onSelectEntry"><code>onSelectEntry(lnr, name, type)</code></a></h3>
			<p>
				This handler is called when an item in the
				list was selected by the user. It is passed the line number, <code>name</code> and
				<code>type</code> of the entry (which can be <code>&quot;file&quot;</code> or <code>&quot;directory&quot;</code>).
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="DirList:scanEntry" id="DirList:scanEntry"><code>table, type = scanEntry(path, name, idx)</code></a></h3>
			<p>
				Scans a single entry
				<code>name</code> in a directory named <code>path</code>. <code>idx</code> is the entry number
				with which this scanned entry will appear in the directory listing.
				<code>table</code> is an array of strings, containing entries like name, size,
				date, permissions, modification date etc. The <code>type</code> return value
				corresponds to the return values of <a href="#DirList:getFileStat"><code>DirList:getFileStat()</code></a>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="DirList:showDirectory" id="DirList:showDirectory"><code>showDirectory(path)</code></a></h3>
			<p>
				Starts reading and displays the specified directory.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="DirList:splitPath" id="DirList:splitPath"><code>path, part = splitPath(path)</code></a></h3>
			<p>
				Splits a path, returning a path and the
				rearmost path or file part. You can override this function to implement
				your own file system naming conventions.
			</p>
			<hr class="page-break" />
		</div>
		<div class="node"><h2><a name="tek.ui.class.display" id="tek.ui.class.display">Display (v33.7)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> :
						<a href="#tek.class">Class</a> /
						<a href="#tek.class.object">Object</a> /
						Display 
					</p>
					<p>
						This class manages a display.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>ATTRIBUTES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<code>AspectX &#091;IG&#093;</code> (number)
							<blockquote>
								<ul>
									<li style="list-style-type: none">
										X component of the display's aspect ratio
									</li>
								</ul>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>AspectY &#091;IG&#093;</code> (number)
							<blockquote>
								<ul>
									<li style="list-style-type: none">
										Y component of the display's aspect ratio
									</li>
								</ul>
							</blockquote>
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>IMPLEMENTS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Display:closeFont"><code>Display:closeFont()</code></a> - Closes font
						</li>
						<li style="list-style-type: none">
							<a href="#Display:createPixMap"><code>Display.createPixMap()</code></a> - Creates a pixmap from picture file data
						</li>
						<li style="list-style-type: none">
							<a href="#Display:getFontAttrs"><code>Display:getFontAttrs()</code></a> - Gets font attributes
						</li>
						<li style="list-style-type: none">
							<a href="#Display:getPaint"><code>Display.getPaint()</code></a> - Gets a a paint object, cached
						</li>
						<li style="list-style-type: none">
							<a href="#Display:colorToRGB"><code>Display:colorToRGB()</code></a> - Converts a color specification to RGB
						</li>
						<li style="list-style-type: none">
							<a href="#Display:getTime"><code>Display.getTime()</code></a> - Gets system time
						</li>
						<li style="list-style-type: none">
							<a href="#Display:openFont"><code>Display:openFont()</code></a> - Opens a named font
						</li>
						<li style="list-style-type: none">
							<a href="#Display:openDrawable"><code>Display.openDrawable()</code></a> - Opens a drawable
						</li>
						<li style="list-style-type: none">
							<a href="#Display:sleep"><code>Display.sleep()</code></a> - Sleeps for a period of time
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>STYLE PROPERTIES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<code>font</code> 
						</li>
						<li style="list-style-type: none">
							<code>font-fixed</code> 
						</li>
						<li style="list-style-type: none">
							<code>font-large</code> 
						</li>
						<li style="list-style-type: none">
							<code>font-x-large</code> 
						</li>
						<li style="list-style-type: none">
							<code>font-xx-large</code> 
						</li>
						<li style="list-style-type: none">
							<code>font-menu</code> 
						</li>
						<li style="list-style-type: none">
							<code>font-small</code> 
						</li>
						<li style="list-style-type: none">
							<code>font-x-small</code> 
						</li>
						<li style="list-style-type: none">
							<code>font-xx-small</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-active</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-active-detail</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-background</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-border-focus</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-border-legend</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-border-rim</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-border-shadow</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-border-shine</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-bright</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-caption-detail</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-cursor</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-cursor-detail</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-dark</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-detail</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-disabled</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-disabled-detail</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-disabled-detail-shine</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-fill</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-focus</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-focus-detail</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-group</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-half-shadow</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-half-shine</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-hover</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-hover-detail</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-list</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-list-active</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-list-active-detail</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-list-detail</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-list-alt</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-menu</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-menu-active</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-menu-active-detail</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-menu-detail</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-outline</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-shadow</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-shine</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-user1</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-user2</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-user3</code> 
						</li>
						<li style="list-style-type: none">
							<code>rgb-user4</code> 
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>OVERRIDES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Class:new"><code>Class.new()</code></a> 
						</li>
					</ul>
				</blockquote>
				<hr />
			</div>
		</div>
		<div class="node"><h3><a name="Display:closeFont" id="Display:closeFont"><code>closeFont(font)</code></a></h3>
			<p>
				Closes the specified font. Always returns <strong>false</strong>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Display:colorToRGB" id="Display:colorToRGB"><code>a, r, g, b = colorToRGB(key)</code></a></h3>
			<p>
				Gets the r, g, b values of a color. The color
				can be a hexadecimal RGB specification or a symbolic name.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Display:createPixmap" id="Display:createPixmap"><code>image, width, height, transparency = Display.createPixmap(picture)</code></a></h3>
			<p>
				Creates a pixmap object from a picture file or from a table.
				See <a href="#Visual:createPixmap"><code>Visual.createPixmap()</code></a>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Display:getFontAttrs" id="Display:getFontAttrs"><code>h, up, ut = getFontAttrs(font)</code></a></h3>
			<p>
				Returns the font attributes height,
				underline position and underline thickness.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Display:getPaint" id="Display:getPaint"><code>image, width, height, transparency = Display.getPaint(imgspec)</code></a></h3>
			<p>
				Gets a paint object from a specifier, either by loading it from the
				filesystem, generating it, or by retrieving it from the cache. To resolve
				symbolic color names, a display instance must be given.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Display:getTime" id="Display:getTime"><code>Display.getTime()</code></a></h3>
			<p>
				Gets the system time.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Display:openDrawable" id="Display:openDrawable"><code>Display.openDrawable()</code></a></h3>
			<p>
				Open a drawable
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Display:openFont" id="Display:openFont"><code>font = openFont(fontspec[, size[, attr]])</code></a></h3>
			<p>
				Opens a font, cached, and with
				complex name resolution and fallbacks. For a discussion of the format
				see <a href="#tek.ui.class.text">Text</a>. The optional size and attr arguments
				allow to override their respective values in the fontspec argument.
			</p>
			<hr class="page-break" />
		</div>
		<div class="node"><h2><a name="tek.ui.class.element" id="tek.ui.class.element">Element (v20.2)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> :
						<a href="#tek.class">Class</a> /
						<a href="#tek.class.object">Object</a> /
						Element / <select onchange="if (this.value != '') window.location.href = this.value; this.selectedIndex = 0;"><option value="">2 subclasses</option><option value="#tek.ui.class.area">Area</option><option value="#tek.ui.class.display">Display</option></select>
					</p>
					<p>
						This class implements the connection to a global environment and
						the registration by Id.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>ATTRIBUTES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<code>Application &#091;G&#093;</code> (<a href="#tek.ui.class.application">Application</a>)
							<blockquote>
								<p>
									The Application the element is registered with.
									This attribute is set during <a href="#Element:setup"><code>Element:setup()</code></a>.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Class &#091;ISG&#093;</code> (string)
							<blockquote>
								<p>
									The name of the element's style class, which can be referenced
									in a style sheet. Multiple classes can be specified by separating
									them with spaces, e.g. <code>&quot;button knob warn&quot;</code>. Setting this
									attribute invokes the <a href="#Element:onSetClass"><code>Element:onSetClass()</code></a> method.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Id &#091;IG&#093;</code> (string)
							<blockquote>
								<p>
									An unique Id identifying the element. If present, this Id will be
									registered with the Application during <a href="#Element:setup"><code>Element:setup()</code></a>.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Parent &#091;G&#093;</code> (object)
							<blockquote>
								<p>
									Parent object of the element. This attribute is set during
									<a href="#Element:connect"><code>Element:connect()</code></a>.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Properties &#091;G&#093;</code> (table)
							<blockquote>
								<p>
									A table of properties, resulting from element and user style
									classes, overlaid with individual and direct formattings, and
									finally from hardcoded element properties. This table is
									initialized in <a href="#Element:decodeProperties"><code>Element:decodeProperties()</code></a>.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Style &#091;ISG&#093;</code> (string)
							<blockquote>
								<p>
									Direct style formattings of the element, overriding class-wide
									formattings in a style sheet. Example:
								</p>
<pre>
&quot;background-color: #880000; color: #ffff00&quot;
</pre>
								<p>
									Setting this attribute invokes the <a href="#Element:onSetStyle"><code>Element:onSetStyle()</code></a> method.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Window &#091;G&#093;</code> (<a href="#tek.ui.class.window">Window</a>)
							<blockquote>
								<p>
									The Window the element is registered with. This
									attribute is set during <a href="#Element:setup"><code>Element:setup()</code></a>.
								</p>
							</blockquote>
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>IMPLEMENTS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Element:addStyleClass"><code>Element:addStyleClass()</code></a> - Appends a style class to an element
						</li>
						<li style="list-style-type: none">
							<a href="#Element:cleanup"><code>Element:cleanup()</code></a> - Unlinks the element from its environment
						</li>
						<li style="list-style-type: none">
							<a href="#Element:connect"><code>Element:connect()</code></a> - Connects the element to a parent element
						</li>
						<li style="list-style-type: none">
							<a href="#Element:decodeProperties"><code>Element:decodeProperties()</code></a> - Decodes the element's style properties
						</li>
						<li style="list-style-type: none">
							<a href="#Element:disconnect"><code>Element:disconnect()</code></a> - Disconnects the element from its parent
						</li>
						<li style="list-style-type: none">
							<a href="#Element:getAttr"><code>Element:getAttr()</code></a> - Gets a named attribute from an element
						</li>
						<li style="list-style-type: none">
							<a href="#Element:getById"><code>Element:getById()</code></a> - Gets a registered element by Id
						</li>
						<li style="list-style-type: none">
							<a href="#Element:getPseudoClass"><code>Element:getPseudoClass()</code></a> - Gets an element's pseudo class
						</li>
						<li style="list-style-type: none">
							<a href="#Element:onSetClass"><code>Element:onSetClass()</code></a> - Gets invoked on changes of <code>Class</code> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:onSetStyle"><code>Element:onSetStyle()</code></a> - Gets invoked on changes of <code>Style</code> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:setup"><code>Element:setup()</code></a> - Links the element to an Application and Window
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>OVERRIDES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Object:addClassNotifications"><code>Object.addClassNotifications()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Class:new"><code>Class.new()</code></a> 
						</li>
					</ul>
				</blockquote>
				<hr />
			</div>
		</div>
		<div class="node"><h3><a name="Element:cleanup" id="Element:cleanup"><code>Element:cleanup()</code></a></h3>
			<p>
				This function unlinks the element from its
				<a href="#tek.ui.class.application">Application</a> and
				<a href="#tek.ui.class.window">Window</a>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Element:connect" id="Element:connect"><code>success = Element:connect(parent)</code></a></h3>
			<p>
				Attempts to connect the element to the
				given <code>parent</code> element; returns a boolean indicating whether the
				connection succeeded.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Element:decodeProperties" id="Element:decodeProperties"><code>Element:decodeProperties(stylesheets)</code></a></h3>
			<p>
				This function decodes the element's
				style properties and places them in the <code>Properties</code> table.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Element:disconnect" id="Element:disconnect"><code>Element:disconnect()</code></a></h3>
			<p>
				Disconnects the element from its parent.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Element:getAttr" id="Element:getAttr"><code>ret1, ... = Element:getAttr(attribute, ...)</code></a></h3>
			<p>
				This function gets a named
				<code>attribute</code> from an element, returning <strong>nil</strong> if the attribute is
				unknown.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Element:getById" id="Element:getById"><code>Element:getById(id)</code></a></h3>
			<p>
				Gets the element with the specified <code>id</code>, that was
				previously registered with the <a href="#tek.ui.class.application">Application</a>.
				This function is a shortcut for <a href="#Application:getById"><code>Application:getById()</code></a>, applied to
				<code>self.Application</code>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Element:getPseudoClass" id="Element:getPseudoClass"><code>pclass = Element:getPseudoClass()</code></a></h3>
			<p>
				Get an element's pseudo class
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Element:onSetClass" id="Element:onSetClass"><code>Element:onSetClass()</code></a></h3>
			<p>
				This method is invoked when the <code>Class</code> 
				attribute has changed. The implementation in the Element class invokes
				<a href="#Element:onSetStyle"><code>Element:onSetStyle()</code></a>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Element:onSetStyle" id="Element:onSetStyle"><code>Element:onSetStyle()</code></a></h3>
			<p>
				This method is invoked when the <code>Style</code> 
				attribute has changed.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Element:setup" id="Element:setup"><code>Element:setup(app, window)</code></a></h3>
			<p>
				This function attaches an element to the
				specified <a href="#tek.ui.class.application">Application</a> and
				<a href="#tek.ui.class.window">Window</a>, and registers the element's Id (if any)
				at the application.
			</p>
			<hr class="page-break" />
		</div>
		<div class="node"><h2><a name="tek.ui.class.family" id="tek.ui.class.family">Family (v2.7)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> :
						<a href="#tek.class">Class</a> /
						<a href="#tek.class.object">Object</a> /
						Family / <select onchange="if (this.value != '') window.location.href = this.value; this.selectedIndex = 0;"><option value="">1 subclasses</option><option value="#tek.ui.class.application">Application</option></select>
					</p>
					<p>
						This class implements a container for child objects.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>ATTRIBUTES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<code>Children &#091;IG&#093;</code> (table)
							<blockquote>
								<p>
									Array of child objects
								</p>
							</blockquote>
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>FUNCTIONS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Family:addMember"><code>Family:addMember()</code></a> - Adds an element to a Family
						</li>
						<li style="list-style-type: none">
							<a href="#Family:remMember"><code>Family:remMember()</code></a> - Removed an element from a Family
						</li>
					</ul>
				</blockquote>
				<hr />
			</div>
		</div>
		<div class="node"><h3><a name="Family:addMember" id="Family:addMember"><code>success = addMember(child[, pos])</code></a></h3>
			<p>
				Invokes the <code>child</code>'s
				<a href="#Element:connect">connect()</a> method to check for its ability to
				integrate into the family, and if successful, inserts it into the
				Family's list of children. Optionally, the child is inserted into the
				list at the specified position.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Family:remMember" id="Family:remMember"><code>success = remMember(child)</code></a></h3>
			<p>
				Looks up <code>child</code> in the family's list of
				children, and if it can be found, invokes its
				<a href="#Element:disconnect">disconnect()</a> method and removes it from the list.
			</p>
			<hr class="page-break" />
		</div>
		<div class="node"><h2><a name="tek.ui.class.floattext" id="tek.ui.class.floattext">FloatText (v22.1)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> :
						<a href="#tek.class">Class</a> /
						<a href="#tek.class.object">Object</a> /
						<a href="#tek.ui.class.element">Element</a> /
						<a href="#tek.ui.class.area">Area</a> /
						FloatText 
					</p>
					<p>
						This class implements a scrollable display of text. An object of
						this class is normally the immediate child of a
						<a href="#tek.ui.class.canvas">Canvas</a>.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>ATTRIBUTES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<code>FGPen &#091;IG&#093;</code> (userdata)
							<blockquote>
								<p>
									Pen for rendering the text. This attribute is controllable via the
									<code>color</code> style property.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Font &#091;IG&#093;</code> (string)
							<blockquote>
								<p>
									Font specifier; see <a href="#tek.ui.class.text">Text</a> for a
									format description. This attribute is controllable via the
									<code>font</code> style property.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Preformatted &#091;IG&#093;</code> (boolean)
							<blockquote>
								<p>
									Boolean, indicating that the text is already formatted and should
									not be reformatted to fit the element's width.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Text &#091;ISG&#093;&#093;</code> (string)
							<blockquote>
								<p>
									The text to be displayed
								</p>
							</blockquote>
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>IMPLEMENTS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#FloatText:appendLine"><code>FloatText:appendLine()</code></a> - Append a line of text
						</li>
						<li style="list-style-type: none">
							<a href="#FloatText:onSetText"><code>FloatText:onSetText()</code></a> - Handler called when <code>Text</code> is changed
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>STYLE PROPERTIES</dfn>
				<blockquote>
					<table>
						<tr>
							<td class="column1">
								<code>color</code> 
							</td>
							<td class="column2">
								controls the <code>FloatText.FGPen</code> attribute
							</td>
						</tr>
						<tr>
							<td class="column1">
								<code>font</code> 
							</td>
							<td class="column2">
								controls the <code>FloatText.Font</code> attribute
							</td>
						</tr>
					</table>
				</blockquote>
			</div>
			<div class="definition"><dfn>OVERRIDES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Object:addClassNotifications"><code>Object.addClassNotifications()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:askMinMax"><code>Area:askMinMax()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:cleanup"><code>Element:cleanup()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:damage"><code>Area:damage()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:draw"><code>Area:draw()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:hide"><code>Area:hide()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:layout"><code>Area:layout()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Class:new"><code>Class.new()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:setState"><code>Area:setState()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:setup"><code>Element:setup()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:show"><code>Area:show()</code></a> 
						</li>
					</ul>
				</blockquote>
				<hr />
			</div>
		</div>
		<div class="node"><h3><a name="FloatText:appendLine" id="FloatText:appendLine"><code>appendLine(text[, movetail])</code></a></h3>
			<p>
				Append a line of text; if the
				optional boolean <code>movetail</code> is <strong>true</strong>, the visible area of the
				element is moved towards the end of the text.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="FloatText:onSetText" id="FloatText:onSetText"><code>onSetText()</code></a></h3>
			<p>
				Handler called when a new <code>Text</code> is set.
			</p>
			<hr class="page-break" />
		</div>
		<div class="node"><h2><a name="tek.ui.class.frame" id="tek.ui.class.frame">Frame (v24.2)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> :
						<a href="#tek.class">Class</a> /
						<a href="#tek.class.object">Object</a> /
						<a href="#tek.ui.class.element">Element</a> /
						<a href="#tek.ui.class.area">Area</a> /
						Frame / <select onchange="if (this.value != '') window.location.href = this.value; this.selectedIndex = 0;"><option value="">4 subclasses</option><option value="#tek.ui.class.canvas">Canvas</option><option value="#tek.ui.class.floattext">FloatText</option><option value="#tek.ui.class.spacer">Spacer</option><option value="#tek.ui.class.widget">Widget</option></select>
					</p>
					<p>
						This class implements an element's borders. The <em>default</em> border
						class handles up to three sub borders:
					</p>
					<blockquote>
						<ul>
							<li>
								The <em>main</em> border is the innermost of the three sub borders.
								It is used to render the primary border style, which can be
								<em>inset</em>, <em>outset</em>, <em>ridge</em>, <em>groove</em>, or
								<em>solid</em>. This border has priority over the other two.
							</li>
							<li>
								The <em>rim</em> border separates the two other borders and
								may give the composition a more contrastful look. This border
								has the lowest priority.
							</li>
							<li>
								The <em>focus</em> border (in addition to the element's focus
								highlighting style) can be used to visualize that the element is
								currently receiving the input. This is the outermost of the three
								sub borders. When the element is in unfocused state, this border
								often appears in the same color as the surrounding group, making
								it indistinguishable from the surrounding background.
							</li>
						</ul>
					</blockquote>
					<p>
						Border classes do not have to implement all sub borders; these
						properties are all handled by the <em>default</em> border class internally,
						and more (and other) sub borders and properties may be defined and
						implemented in the future (or in other border classes). As the Frame
						class has no notion of sub borders, their respective widths are
						subtracted from the Element's total border width, leaving only the
						remaining width for the <em>main</em> border.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>ATTRIBUTES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<code>BorderRegion &#091;G&#093;</code> (<a href="#tek.lib.region">Region</a>)
							<blockquote>
								<p>
									Region object holding the outline of the element's border
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Legend &#091;IG&#093;</code> (string)
							<blockquote>
								<p>
									Border legend text
								</p>
							</blockquote>
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>STYLE PROPERTIES</dfn>
				<blockquote>
					<table>
						<tr>
							<td class="column1">
								<em>border-bottom-color</em> 
							</td>
							<td class="column2">
								controls the <em>default</em> border class
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>border-bottom-width</em> 
							</td>
							<td class="column2">
								controls <code>Frame.Border</code> 
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>border-class</em> 
							</td>
							<td class="column2">
								controls <code>Frame.BorderClass</code> 
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>border-color</em> 
							</td>
							<td class="column2">
								controls the <em>default</em> border class
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>border-focus-color</em> 
							</td>
							<td class="column2">
								controls the <em>default</em> border class
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>border-focus-width</em> 
							</td>
							<td class="column2">
								controls the <em>default</em> border class
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>border-left-color</em> 
							</td>
							<td class="column2">
								controls the <em>default</em> border class
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>border-left-width</em> 
							</td>
							<td class="column2">
								controls <code>Frame.Border</code> 
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>border-legend-font</em> 
							</td>
							<td class="column2">
								controls the <em>default</em> border class
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>border-legend-align</em> 
							</td>
							<td class="column2">
								controls the <em>default</em> border class
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>border-right-color</em> 
							</td>
							<td class="column2">
								controls the <em>default</em> border class
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>border-right-width</em> 
							</td>
							<td class="column2">
								controls <code>Frame.Border</code> 
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>border-rim-color</em> 
							</td>
							<td class="column2">
								controls the <em>default</em> border class
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>border-rim-width</em> 
							</td>
							<td class="column2">
								controls the <em>default</em> border class
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>border-style</em> 
							</td>
							<td class="column2">
								controls the <em>default</em> border class
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>border-top-color</em> 
							</td>
							<td class="column2">
								controls the <em>default</em> border class
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>border-top-width</em> 
							</td>
							<td class="column2">
								controls <code>Frame.Border</code> 
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>border-width</em> 
							</td>
							<td class="column2">
								controls <code>Frame.Border</code> 
							</td>
						</tr>
					</table>
				</blockquote>
			</div>
			<div class="definition"><dfn>IMPLEMENTS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Frame:drawBorder"><code>Frame:drawBorder()</code></a> - Draws the element's border
						</li>
						<li style="list-style-type: none">
							<a href="#Frame:getBorder"><code>Frame:getBorder()</code></a> - Queries the element's border
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>OVERRIDES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Element:cleanup"><code>Element:cleanup()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:damage"><code>Area:damage()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:draw"><code>Area:draw()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:getByXY"><code>Area:getByXY()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:getMargin"><code>Area:getMargin()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:layout"><code>Area:layout()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Class:new"><code>Class.new()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:onSetStyle"><code>Element:onSetStyle()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:punch"><code>Area:punch()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:setState"><code>Area:setState()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:setup"><code>Element:setup()</code></a> 
						</li>
					</ul>
				</blockquote>
				<hr class="page-break" />
			</div>
		</div>
		<div class="node"><h2><a name="tek.ui.class.gauge" id="tek.ui.class.gauge">Gauge (v17.5)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> :
						<a href="#tek.class">Class</a> /
						<a href="#tek.class.object">Object</a> /
						<a href="#tek.ui.class.element">Element</a> /
						<a href="#tek.ui.class.area">Area</a> /
						<a href="#tek.ui.class.frame">Frame</a> /
						<a href="#tek.ui.class.widget">Widget</a> /
						<a href="#tek.ui.class.numeric">Numeric</a> /
						Gauge 
					</p>
					<p>
						This class implements a gauge for the visualization of
						numerical values.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>OVERRIDES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Area:askMinMax"><code>Area:askMinMax()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:cleanup"><code>Element:cleanup()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:draw"><code>Area:draw()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:hide"><code>Area:hide()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:layout"><code>Area:layout()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Class:new"><code>Class.new()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Numeric:onSetValue"><code>Numeric:onSetValue()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:setup"><code>Element:setup()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:show"><code>Area:show()</code></a> 
						</li>
					</ul>
				</blockquote>
				<hr class="page-break" />
			</div>
		</div>
		<div class="node"><h2><a name="tek.ui.class.group" id="tek.ui.class.group">Group (v35.2)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> :
						<a href="#tek.class">Class</a> /
						<a href="#tek.class.object">Object</a> /
						<a href="#tek.ui.class.element">Element</a> /
						<a href="#tek.ui.class.area">Area</a> /
						<a href="#tek.ui.class.frame">Frame</a> /
						<a href="#tek.ui.class.widget">Widget</a> /
						Group / <select onchange="if (this.value != '') window.location.href = this.value; this.selectedIndex = 0;"><option value="">6 subclasses</option><option value="#tek.ui.class.dirlist">DirList</option><option value="#tek.ui.class.listview">ListView</option><option value="#tek.ui.class.pagegroup">PageGroup</option><option value="#tek.ui.class.scrollbar">ScrollBar</option><option value="#tek.ui.class.scrollgroup">ScrollGroup</option><option value="#tek.ui.class.window">Window</option></select>
					</p>
					<p>
						This class implements a container for child elements and
						various layouting options.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>ATTRIBUTES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<code>Children &#091;IG&#093;</code> (table)
							<blockquote>
								<p>
									A table of the object's children
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Columns &#091;IG&#093;</code> (number)
							<blockquote>
								<p>
									Grid width, in number of elements &#091;Default: 1, not a grid&#093;
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>FreeRegion &#091;G&#093;</code> (<a href="#tek.lib.region">Region</a>)
							<blockquote>
								<p>
									Region inside the group that is not covered by child elements
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Layout &#091;IG&#093;</code> (string or <a href="#tek.ui.class.layout">Layout</a>)
							<blockquote>
								<p>
									The name of a layouter class (or a Layouter object) used for
									layouting the element's children. Default: <code>&quot;default&quot;</code> 
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Orientation &#091;IG&#093;</code> (string)
							<blockquote>
								<p>
									Orientation of the group; can be
								</p>
								<blockquote>
									<ul>
										<li style="list-style-type: none">
											<code>&quot;horizontal&quot;</code> - The elements are layouted horizontally
										</li>
										<li style="list-style-type: none">
											<code>&quot;vertical&quot;</code> - The elements are layouted vertically
										</li>
									</ul>
								</blockquote>
								<p>
									Default: <code>&quot;horizontal&quot;</code> 
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Rows &#091;IG&#093;</code> (number)
							<blockquote>
								<p>
									Grid height, in number of elements. &#091;Default: 1, not a grid&#093;
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>SameSize &#091;IG&#093;</code> (boolean, <code>&quot;width&quot;</code>, <code>&quot;height&quot;</code>)
							<blockquote>
								<p>
									<strong>true</strong> indicates that the same width and height should
									be reserved for all elements in the group; the keywords
									<code>&quot;width&quot;</code> and <code>&quot;height&quot;</code> specify that only the same width or
									height should be reserved, respectively. Default: <strong>false</strong> 
								</p>
							</blockquote>
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>IMPLEMENTS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<code>Group:addMember()</code> - See <a href="#Family:addMember"><code>Family:addMember()</code></a> 
						</li>
						<li style="list-style-type: none">
							<code>Group:remMember()</code> - See <a href="#Family:remMember"><code>Family:remMember()</code></a> 
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>OVERRIDES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Area:askMinMax"><code>Area:askMinMax()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:cleanup"><code>Element:cleanup()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:damage"><code>Area:damage()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:decodeProperties"><code>Element:decodeProperties()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:draw"><code>Area:draw()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:erase"><code>Area:erase()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:getBGElement"><code>Area:getBGElement()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:getByXY"><code>Area:getByXY()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:getChildren"><code>Area:getChildren()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:getGroup"><code>Area:getGroup()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:hide"><code>Area:hide()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:layout"><code>Area:layout()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Class:new"><code>Class.new()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:passMsg"><code>Area:passMsg()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:punch"><code>Area:punch()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:setup"><code>Element:setup()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:show"><code>Area:show()</code></a> 
						</li>
					</ul>
				</blockquote>
				<hr class="page-break" />
			</div>
		</div>
		<div class="node"><h2><a name="tek.ui.class.handle" id="tek.ui.class.handle">Handle (v7.2)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> :
						<a href="#tek.class">Class</a> /
						<a href="#tek.class.object">Object</a> /
						<a href="#tek.ui.class.element">Element</a> /
						<a href="#tek.ui.class.area">Area</a> /
						<a href="#tek.ui.class.frame">Frame</a> /
						<a href="#tek.ui.class.widget">Widget</a> /
						Handle 
					</p>
					<p>
						Implements a handle that can be dragged along the axis of the Group's
						orientation. It reassigns Weights to its flanking elements.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>OVERRIDES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Area:askMinMax"><code>Area:askMinMax()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:checkFocus"><code>Area:checkFocus()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:draw"><code>Area:draw()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Class:new"><code>Class.new()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:passMsg"><code>Area:passMsg()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:show"><code>Area:show()</code></a> 
						</li>
					</ul>
				</blockquote>
				<hr class="page-break" />
			</div>
		</div>
		<div class="node"><h2><a name="tek.ui.class.imagewidget" id="tek.ui.class.imagewidget">ImageWidget (v15.2)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> :
						<a href="#tek.class">Class</a> /
						<a href="#tek.class.object">Object</a> /
						<a href="#tek.ui.class.element">Element</a> /
						<a href="#tek.ui.class.area">Area</a> /
						<a href="#tek.ui.class.frame">Frame</a> /
						<a href="#tek.ui.class.widget">Widget</a> /
						ImageWidget 
					</p>
					<p>
						This class implements widgets with an image.
						Images are instances of the Image class, which handles pixmaps
						and simple vector graphics.
						They can be obtained by <a href="#ui:loadImage"><code>ui.loadImage()</code></a>, <a href="#ui:getStockImage"><code>ui.getStockImage()</code></a>,
						or by directly instantiating the Image class or derivations thereof.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>ATTRIBUTES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<code>Image &#091;ISG&#093;</code> (image object)
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>IMPLEMENTS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#ImageWidget:onSetImage"><code>ImageWidget:onSetImage()</code></a> - Handler for the <code>Image</code> attribute
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>OVERRIDES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Object:addClassNotifications"><code>Object.addClassNotifications()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:askMinMax"><code>Area:askMinMax()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:draw"><code>Area:draw()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:layout"><code>Area:layout()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Object:new"><code>Object.new()</code></a> 
						</li>
					</ul>
				</blockquote>
				<hr />
			</div>
		</div>
		<div class="node"><h3><a name="ImageWidget:onSetImage" id="ImageWidget:onSetImage"><code>onSetImage()</code></a></h3>
			<p>
				This handler is invoked when the element's <code>Image</code> 
				attribute has changed.
			</p>
			<hr class="page-break" />
		</div>
		<div class="node"><h2><a name="tek.ui.class.input" id="tek.ui.class.input">Input (v4.8)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> :
						<a href="#tek.class">Class</a> /
						<a href="#tek.class.object">Object</a> /
						<a href="#tek.ui.class.element">Element</a> /
						<a href="#tek.ui.class.area">Area</a> /
						<a href="#tek.ui.class.frame">Frame</a> /
						<a href="#tek.ui.class.widget">Widget</a> /
						<a href="#tek.ui.class.group">Group</a> /
						<a href="#tek.ui.class.scrollgroup">ScrollGroup</a> /
						Input 
					</p>
					<p>
						Text input class
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>ATTRIBUTES</dfn>
			</div>
			<div class="definition"><dfn>STYLE PROPERTIES</dfn>
			</div>
			<div class="definition"><dfn>IMPLEMENTS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Input:getText"><code>Input:getText()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Input:onEnter"><code>Input:onEnter()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Input:onSetText"><code>Input:onSetText()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Input:onSetChanged"><code>Input:onSetChanged()</code></a> 
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>OVERRIDES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Class:new"><code>Class.new()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Widget:onDisable"><code>Widget:onDisable()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Widget:onActivate"><code>Widget:onActivate()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Widget:onFocus"><code>Widget:onFocus()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Widget:checkFocus"><code>Widget:checkFocus()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Widget:activate"><code>Widget:activate()</code></a> 
						</li>
					</ul>
				</blockquote>
				<hr class="page-break" />
			</div>
		</div>
		<div class="node"><h2><a name="tek.ui.class.layout" id="tek.ui.class.layout">Layout (v1.1)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> :
						<a href="#tek.class">Class</a> /
						Layout / <select onchange="if (this.value != '') window.location.href = this.value; this.selectedIndex = 0;"><option value="">2 subclasses</option><option value="#tek.ui.layout.default">DefaultLayout</option><option value="#tek.ui.layout.fixed">FixedLayout</option></select>
					</p>
					<p>
						A layouter implements a group's
						layouting strategy. The <code>&quot;default&quot;</code> layouter implements a dynamic,
						scalable layout, which adapts to the free space available to the
						group.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>IMPLEMENTS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Layout:layout"><code>Layout:layout()</code></a> - Layouts the group
						</li>
						<li style="list-style-type: none">
							<a href="#Layout:askMinMax"><code>Layout:askMinMax()</code></a> - Queries the group's minimum and maximum
							size requirements
						</li>
					</ul>
				</blockquote>
				<hr />
			</div>
		</div>
		<div class="node"><h3><a name="Layout:askMinMax" id="Layout:askMinMax"><code>minw, minh, maxw, maxh = Layout:askMinMax(group, minw, minh, maxw, maxh)</code></a></h3>
			<p>
				This function queries the specified <a href="#tek.ui.class.group">Group</a> for
				its size requirements.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Layout:layout" id="Layout:layout"><code>Layout:layout(group, x0, y0, x1, y1[, markdamage])</code></a></h3>
			<p>
				Layouts the <a href="#tek.ui.class.group">Group</a> into the specified
				rectangle and calculates the new sizes and positions of all of its
				children. The optional boolean <code>markdamage</code> is passed to subsequent
				invocations of <a href="#Area:layout">child:layout()</a>. This function will
				also call the <a href="#Area:punch">punch()</a> method on each child for
				subtracting their new outlines from the group's <code>FreeRegion</code>.
			</p>
			<hr class="page-break" />
		</div>
		<div class="node"><h2><a name="tek.ui.class.lister" id="tek.ui.class.lister">Lister (v32.1)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> :
						<a href="#tek.class">Class</a> /
						<a href="#tek.class.object">Object</a> /
						<a href="#tek.ui.class.element">Element</a> /
						<a href="#tek.ui.class.area">Area</a> /
						<a href="#tek.ui.class.frame">Frame</a> /
						<a href="#tek.ui.class.widget">Widget</a> /
						<a href="#tek.ui.class.text">Text</a> /
						Lister 
					</p>
					<p>
						This class implements a scrollable list or table. Each item in the
						list is a table consisting of the following elements:
					</p>
<pre>
{ { &quot;column1&quot;, &quot;column2&quot;, ... }, userdata, selected, ... }
</pre>
					<p>
						Description:
					</p>
					<blockquote>
						<ul>
							<li style="list-style-type: none">
								<code>entry&#091;1&#093;</code> is a table containing the text of each column;
							</li>
							<li style="list-style-type: none">
								<code>entry&#091;2&#093;</code> is a userdata field which can be used at will;
							</li>
							<li style="list-style-type: none">
								<code>entry&#091;3&#093;</code> is a boolean indicating that the line is selected.
							</li>
						</ul>
					</blockquote>
					<p>
						The following fields are reserved for internal use by the Lister;
						you should never rely on their contents or modify them.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>ATTRIBUTES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<code>AlignColumn &#091;IG&#093;</code> (number)
							<blockquote>
								<p>
									A column number to align the right edge of the list to.
									&#091;Default: unspecified&#093;
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>AlignElement &#091;IG&#093;</code> (Object)
							<blockquote>
								<p>
									The object determining the right edge of the list, which
									is an information needed for the <code>AlignColumn</code> attribute.
									By default, the Lister's parent <code>Canvas</code> is used, but by
									use of this attribute it is possible to align the Lister to
									something else.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>BGAlt &#091;IG&#093;</code> (userdata)
							<blockquote>
								<p>
									A colored pen for painting the background of alternating lines
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>ColumnPadding &#091;IG&#093;</code> (number)
							<blockquote>
								<p>
									The padding between columns, in pixels. By default, the
									Lister's <code>Font</code> is used to determine a reasonable offset.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>CursorBorderClass &#091;IG&#093;</code> (string)
							<blockquote>
								<p>
									Name of the border class used to implement this element's
									cursor border. Default: &quot;default&quot;
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>CursorLine &#091;ISG&#093;</code> (number)
							<blockquote>
								<p>
									The line number of the Lister's cursor; this value may
									be <code>0</code>, in which case the cursor is invisible. Changing
									this value will invoke the <a href="#Lister:onSetCursor"><code>Lister:onSetCursor()</code></a> method.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>HeaderGroup &#091;IG&#093;</code> (<a href="#tek.ui.class.group">Group</a>)
							<blockquote>
								<p>
									A group of elements used for the table header. The Lister
									may take these elements into account for determining the
									initial column widths.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>ListObject &#091;IG&#093;</code> (<a href="#tek.class.list">List</a>)
							<blockquote>
								<p>
									The List object the Lister operates on; if none is specified,
									the Lister creates an empty one.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>NumSelectedLines &#091;G&#093;</code> (number)
							<blockquote>
								<p>
									The number of lines currently selected.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>SelectedLines &#091;G&#093;</code> (table)
							<blockquote>
								<p>
									This attribute is a (sparse) table containing the numbers of
									selected lines in the list. Use <code>pairs()</code> to iterate it.
									See also <a href="#Lister:getSelectedLines"><code>Lister:getSelectedLines()</code></a> for retrieving a
									numerically indexed list.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>SelectedLine &#091;ISG&#093;</code> (number)
							<blockquote>
								<p>
									The Lister's current selected line; this value reflects only
									the line that was most recently selected or unselected - for
									locating all currently selected lines, you will also need
									the <code>SelectedLines</code> attribute. Setting this value will invoke
									the <a href="#Lister:onSelectLine"><code>Lister:onSelectLine()</code></a> method.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>SelectMode &#091;IG&#093;</code> (string)
							<blockquote>
								<p>
									The Lister's selection mode, which can be <code>&quot;none&quot;</code>,
									<code>&quot;single&quot;</code>, or <code>&quot;multi&quot;</code>.
								</p>
							</blockquote>
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>IMPLEMENTS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Lister:addItem"><code>Lister:addItem()</code></a> - Adds an item to the list
						</li>
						<li style="list-style-type: none">
							<a href="#Lister:changeItem"><code>Lister:changeItem()</code></a> - Overwrite item in the list
						</li>
						<li style="list-style-type: none">
							<a href="#Lister:changeSelection"><code>Lister:changeSelection()</code></a> - Changes selection of the list
						</li>
						<li style="list-style-type: none">
							<a href="#Lister:clear"><code>Lister:clear()</code></a> - Removes all items from the list
						</li>
						<li style="list-style-type: none">
							<a href="#Lister:damageLine"><code>Lister:damageLine()</code></a> - Marks line for repainting
						</li>
						<li style="list-style-type: none">
							<a href="#Lister:getItem"><code>Lister:getItem()</code></a> - Returns the item at the specified line
						</li>
						<li style="list-style-type: none">
							<a href="#Lister:getN"><code>Lister:getN()</code></a> - Returns the number of entries in the list
						</li>
						<li style="list-style-type: none">
							<a href="#Lister:getSelectedLines"><code>Lister:getSelectedLines()</code></a> - Returns a table of selected entries
						</li>
						<li style="list-style-type: none">
							<a href="#Lister:onSelectLine"><code>Lister:onSelectLine()</code></a> - Handler invoked for <code>SelectedLine</code> 
						</li>
						<li style="list-style-type: none">
							<a href="#Lister:onSetCursor"><code>Lister:onSetCursor()</code></a> - Handler invoked for <code>CursorLine</code> 
						</li>
						<li style="list-style-type: none">
							<a href="#Lister:repaint"><code>Lister:repaint()</code></a> - Relayouts and repaints the list
						</li>
						<li style="list-style-type: none">
							<a href="#Lister:remItem"><code>Lister:remItem()</code></a> - Removes an item from the list
						</li>
						<li style="list-style-type: none">
							<a href="#Lister:setList"><code>Lister:setList()</code></a> - Sets a new list object
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>STYLE PROPERTIES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<code>background-color2</code> 
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>OVERRIDES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Area:askMinMax"><code>Area:askMinMax()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:cleanup"><code>Element:cleanup()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:connect"><code>Element:connect()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:draw"><code>Area:draw()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:hide"><code>Area:hide()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:layout"><code>Area:layout()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Class:new"><code>Class.new()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Frame:onFocus"><code>Frame:onFocus()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:passMsg"><code>Area:passMsg()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:setState"><code>Area:setState()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:setup"><code>Element:setup()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:show"><code>Area:show()</code></a> 
						</li>
					</ul>
				</blockquote>
				<hr />
			</div>
		</div>
		<div class="node"><h3><a name="Lister:addItem" id="Lister:addItem"><code>addItem(item[, line[, quick]])</code></a></h3>
			<p>
				Adds an item to the list. If
				<code>line</code> is unspecified, the entry is added at the end of the list. The
				boolean <code>quick</code> indicates that the list should not be relayouted and
				repainted. (For relayouting and repainting the list after mass addition,
				see also <a href="#Lister:repaint"><code>Lister:repaint()</code></a>.)
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Lister:changeItem" id="Lister:changeItem"><code>changeItem(item, line[, quick])</code></a></h3>
			<p>
				Overwrites the <code>item</code> at the
				specified <code>line</code> in the list. The boolean <code>quick</code> indicates that
				the list should not be relayouted and repainted. For relayouting and
				repainting the list after mass changes, see also <a href="#Lister:repaint"><code>Lister:repaint()</code></a>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Lister:changeSelection" id="Lister:changeSelection"><code>changeSelection(mode)</code></a></h3>
			<p>
				Changes the selection of the entire
				list; modes supported are:
			</p>
			<blockquote>
				<ul>
					<li style="list-style-type: none">
						&quot;none&quot;: marks all lines as unselected
					</li>
				</ul>
			</blockquote>
			<hr />
		</div>
		<div class="node"><h3><a name="Lister:clear" id="Lister:clear"><code>clear()</code></a></h3>
			<p>
				Remove all items from the list.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Lister:damageLine" id="Lister:damageLine"><code>damageLine(lnr)</code></a></h3>
			<p>
				Marks the specified line for repainting.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Lister:getItem" id="Lister:getItem"><code>getItem(line)</code></a></h3>
			<p>
				Returns the item at the specified line.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Lister:getN" id="Lister:getN"><code>getN()</code></a></h3>
			<p>
				Returns the number of lines in the list.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Lister:getSelectedLines" id="Lister:getSelectedLines"><code>getSelectedLines([mode])</code></a></h3>
			<p>
				Returns a table of all
				selected entries, sorted by (by default) their line number. Currently
				defined modes are &quot;ascending&quot; or &quot;descending&quot;. Default: &quot;ascending&quot;
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Lister:onDblClick" id="Lister:onDblClick"><code>onDblClick()</code></a></h3>
			<p>
				overrides
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Lister:onSelectLine" id="Lister:onSelectLine"><code>onSelectLine()</code></a></h3>
			<p>
				This method is invoked when the <code>SelectedLine</code> 
				attribute is set.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Lister:onSetCursor" id="Lister:onSetCursor"><code>onSetCursor()</code></a></h3>
			<p>
				This method is invoked when the
				<code>CursorLine</code> attribute has changed.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Lister:remItem" id="Lister:remItem"><code>remItem(line[, quick])</code></a></h3>
			<p>
				Removes the item from the list at the
				specified line. The boolean <code>quick</code> indicates that the list should not
				be relayouted and repainted. (For relayouting and repainting the list
				after mass removal, see also <a href="#Lister:repaint"><code>Lister:repaint()</code></a>.)
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Lister:repaint" id="Lister:repaint"><code>repaint()</code></a></h3>
			<p>
				Relayouts and repaints the list.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Lister:setList" id="Lister:setList"><code>setList(listobject)</code></a></h3>
			<p>
				Sets a new <a href="#tek.class.list">List</a> 
				object, and relayouts and repaints the list.
			</p>
			<hr class="page-break" />
		</div>
		<div class="node"><h2><a name="tek.ui.class.listview" id="tek.ui.class.listview">ListView (v6.4)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> :
						<a href="#tek.class">Class</a> /
						<a href="#tek.class.object">Object</a> /
						<a href="#tek.ui.class.element">Element</a> /
						<a href="#tek.ui.class.area">Area</a> /
						<a href="#tek.ui.class.frame">Frame</a> /
						<a href="#tek.ui.class.widget">Widget</a> /
						<a href="#tek.ui.class.group">Group</a> /
						ListView 
					</p>
					<p>
						This class implements a <a href="#tek.ui.class.group">Group</a> containing
						a <a href="#tek.ui.class.scrollgroup">ScrollGroup</a> and optionally a
						group of column headers; its main purpose is to automate the somewhat
						complicated setup of multi-column lists with headers, but it can be
						used for single-column lists and lists without column headers as well.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>ATTRIBUTES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<code>Headers &#091;I&#093;</code> (table)
							<blockquote>
								<p>
									An array of strings containing the captions of column headers.
									&#091;Default: unspecified&#093;
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>HSliderMode &#091;I&#093;</code> (string)
							<blockquote>
								<p>
									This attribute is passed on the
									<a href="#tek.ui.class.scrollgroup">ScrollGroup</a> - see there.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>VSliderMode &#091;I&#093;</code> (string)
							<blockquote>
								<p>
									This attribute is passed on the
									<a href="#tek.ui.class.scrollgroup">ScrollGroup</a> - see there.
								</p>
							</blockquote>
						</li>
					</ul>
				</blockquote>
				<hr class="page-break" />
			</div>
		</div>
		<div class="node"><h2><a name="tek.ui.class.menuitem" id="tek.ui.class.menuitem">MenuItem (v11.1)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> :
						<a href="#tek.class">Class</a> /
						<a href="#tek.class.object">Object</a> /
						<a href="#tek.ui.class.element">Element</a> /
						<a href="#tek.ui.class.area">Area</a> /
						<a href="#tek.ui.class.frame">Frame</a> /
						<a href="#tek.ui.class.widget">Widget</a> /
						<a href="#tek.ui.class.text">Text</a> /
						<a href="#tek.ui.class.popitem">PopItem</a> /
						MenuItem 
					</p>
					<p>
						This class implements basic, recursive items for window and popup
						menus with a typical menu look; in particular, it displays the
						<a href="#tek.ui.class.popitem">PopItem</a>'s <code>Shortcut</code> string and an
						arrow to indicate the presence of a sub menu.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>OVERRIDES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Area:askMinMax"><code>Area:askMinMax()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:draw"><code>Area:draw()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:layout"><code>Area:layout()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Class:new"><code>Class.new()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:show"><code>Area:show()</code></a> 
						</li>
					</ul>
				</blockquote>
				<hr class="page-break" />
			</div>
		</div>
		<div class="node"><h2><a name="tek.ui.class.numeric" id="tek.ui.class.numeric">Numeric (v5.2)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> :
						<a href="#tek.class">Class</a> /
						<a href="#tek.class.object">Object</a> /
						<a href="#tek.ui.class.element">Element</a> /
						<a href="#tek.ui.class.area">Area</a> /
						<a href="#tek.ui.class.frame">Frame</a> /
						<a href="#tek.ui.class.widget">Widget</a> /
						Numeric / <select onchange="if (this.value != '') window.location.href = this.value; this.selectedIndex = 0;"><option value="">2 subclasses</option><option value="#tek.ui.class.gauge">Gauge</option><option value="#tek.ui.class.slider">Slider</option></select>
					</p>
					<p>
						This class implements the management of numerical
						values. Without further specialization it has hardly any real-life
						use and may be considered an abstract class. See also
						<a href="#tek.ui.class.gauge">Gauge</a> and <a href="#tek.ui.class.slider">Slider</a> 
						for some of its child classes.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>ATTRIBUTES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<code>Default &#091;IG&#093;</code> (number)
							<blockquote>
								<p>
									The default for <code>Value</code>, which can be revoked using the
									<a href="#Numeric:reset"><code>Numeric:reset()</code></a> method.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Increment &#091;ISG&#093;</code> (number)
							<blockquote>
								<p>
									Default increase/decrease step value &#091;Default: 1&#093;
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Max &#091;ISG&#093;</code> (number)
							<blockquote>
								<p>
									Maximum acceptable <code>Value</code>. Setting this value
									invokes the <a href="#Numeric:onSetMax"><code>Numeric:onSetMax()</code></a> method.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Min &#091;ISG&#093;</code> (number)
							<blockquote>
								<p>
									Minimum acceptable <code>Value</code>. Setting this value
									invokes the <a href="#Numeric:onSetMin"><code>Numeric:onSetMin()</code></a> method.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Value &#091;ISG&#093;</code> (number)
							<blockquote>
								<p>
									The current value represented by this class. Setting this
									value causes the <a href="#Numeric:onSetValue"><code>Numeric:onSetValue()</code></a> method to be invoked.
								</p>
							</blockquote>
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>IMPLEMENTS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Numeric:decrease"><code>Numeric:decrease()</code></a> - Decreases <code>Value</code> 
						</li>
						<li style="list-style-type: none">
							<a href="#Numeric:increase"><code>Numeric:increase()</code></a> - Increments <code>Value</code> 
						</li>
						<li style="list-style-type: none">
							<a href="#Numeric:onSetMax"><code>Numeric:onSetMax()</code></a> - Handler for the <code>Max</code> attribute
						</li>
						<li style="list-style-type: none">
							<a href="#Numeric:onSetMin"><code>Numeric:onSetMin()</code></a> - Handler for the <code>Min</code> attribute
						</li>
						<li style="list-style-type: none">
							<a href="#Numeric:onSetValue"><code>Numeric:onSetValue()</code></a> - Handler for the <code>Value</code> attribute
						</li>
						<li style="list-style-type: none">
							<a href="#Numeric:reset"><code>Numeric:reset()</code></a> - Resets <code>Value</code> to the <code>Default</code> value
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>OVERRIDES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Object:addClassNotifications"><code>Object.addClassNotifications()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:cleanup"><code>Element:cleanup()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Class:new"><code>Class.new()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:setup"><code>Element:setup()</code></a> 
						</li>
					</ul>
				</blockquote>
				<hr />
			</div>
		</div>
		<div class="node"><h3><a name="Numeric:decrease" id="Numeric:decrease"><code>decrease([delta])</code></a></h3>
			<p>
				Decrease <code>Value</code> by the specified <code>delta</code>.
				If <code>delta</code> is omitted, the <code>Increment</code> attribute is used in its place.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Numeric:increase" id="Numeric:increase"><code>increase([delta])</code></a></h3>
			<p>
				Increment <code>Value</code> by the specified <code>delta</code>.
				If <code>delta</code> is omitted, the <code>Increment</code> attribute is used in its place.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Numeric:onSetMax" id="Numeric:onSetMax"><code>onSetMax()</code></a></h3>
			<p>
				This handler is invoked when the Numeric's <code>Max</code> 
				attribute has changed.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Numeric:onSetMin" id="Numeric:onSetMin"><code>onSetMin()</code></a></h3>
			<p>
				This handler is invoked when the Numeric's <code>Min</code> 
				attribute has changed.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Numeric:onSetValue" id="Numeric:onSetValue"><code>onSetValue()</code></a></h3>
			<p>
				This handler is invoked when the Numeric's <code>Value</code> 
				attribute has changed.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Numeric:reset" id="Numeric:reset"><code>reset()</code></a></h3>
			<p>
				Reset <code>Value</code> to is <code>Default</code> value.
			</p>
			<hr class="page-break" />
		</div>
		<div class="node"><h2><a name="tek.ui.class.pagegroup" id="tek.ui.class.pagegroup">PageGroup (v19.7)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> :
						<a href="#tek.class">Class</a> /
						<a href="#tek.class.object">Object</a> /
						<a href="#tek.ui.class.element">Element</a> /
						<a href="#tek.ui.class.area">Area</a> /
						<a href="#tek.ui.class.frame">Frame</a> /
						<a href="#tek.ui.class.widget">Widget</a> /
						<a href="#tek.ui.class.group">Group</a> /
						PageGroup 
					</p>
					<p>
						Implements a group whose children are layouted in individual
						pages.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>ATTRIBUTES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<code>PageCaptions &#091;IG&#093;</code> (table)
							<blockquote>
								<p>
									An array of strings containing captions for each page in
									the group. If <strong>false</strong>, no page captions will be displayed.
									&#091;Default: <strong>false</strong>&#093;
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>PageNumber &#091;ISG&#093;</code> (number)
							<blockquote>
								<p>
									Number of the page that is initially selected. &#091;Default: 1&#093;
									Setting this attribute invokes the <a href="#PageGroup:onSetPageNumber"><code>PageGroup:onSetPageNumber()</code></a> 
									method.
								</p>
							</blockquote>
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>IMPLEMENTS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#PageGroup:disablePage"><code>PageGroup:disablePage()</code></a> - Enables a Page
						</li>
						<li style="list-style-type: none">
							<a href="#PageGroup:onSetPageNumber"><code>PageGroup:onSetPageNumber()</code></a> - Handler for <code>PageNumber</code> 
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>OVERRIDES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Element:cleanup"><code>Element:cleanup()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Class:new"><code>Class.new()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:setup"><code>Element:setup()</code></a> 
						</li>
					</ul>
				</blockquote>
				<hr />
			</div>
		</div>
		<div class="node"><h3><a name="PageGroup:disablePage" id="PageGroup:disablePage"><code>disablePage(pagenum, onoff)</code></a></h3>
			<p>
				This function allows to disable or re-enable
				a page button identified by <code>pagenum</code>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="PageGroup:onSetPageNumber" id="PageGroup:onSetPageNumber"><code>onSetPageNumber()</code></a></h3>
			<p>
				This method is invoked when the element's
				<code>PageNumber</code> attribute has changed.
			</p>
			<hr class="page-break" />
		</div>
		<div class="node"><h2><a name="tek.ui.class.popitem" id="tek.ui.class.popitem">PopItem (v26.2)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> :
						<a href="#tek.class">Class</a> /
						<a href="#tek.class.object">Object</a> /
						<a href="#tek.ui.class.element">Element</a> /
						<a href="#tek.ui.class.area">Area</a> /
						<a href="#tek.ui.class.frame">Frame</a> /
						<a href="#tek.ui.class.widget">Widget</a> /
						<a href="#tek.ui.class.text">Text</a> /
						PopItem / <select onchange="if (this.value != '') window.location.href = this.value; this.selectedIndex = 0;"><option value="">2 subclasses</option><option value="#tek.ui.class.menuitem">MenuItem</option><option value="#tek.ui.class.poplist">PopList</option></select>
					</p>
					<p>
						This class provides an anchorage for popups. This also works
						recursively, i.e. elements of the PopItem class may contain other
						PopItems as their children. The most notable child class of the
						PopItem is the <a href="#tek.ui.class.menuitem">MenuItem</a>.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>ATTRIBUTES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<code>Children &#091;I&#093;</code> (table)
							<blockquote>
								<p>
									Array of child objects - will be connected to the application
									while the popup is open.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Shortcut &#091;IG&#093;</code> (string)
							<blockquote>
								<p>
									Keyboard shortcut for the object; unlike
									<a href="#tek.ui.class.widget">Widget</a>.KeyCode, this shortcut is
									also enabled while the object is invisible. By convention, only
									combinations with a qualifier should be used here, e.g.
									<code>&quot;Alt+C&quot;</code>, <code>&quot;Shift+Ctrl+Q&quot;</code>. Qualifiers are separated by
									<code>&quot;+&quot;</code> and must precede the key. Valid qualifiers are:
								</p>
								<blockquote>
									<ul>
										<li style="list-style-type: none">
											<code>&quot;Alt&quot;</code>, <code>&quot;LAlt&quot;</code>, <code>&quot;RAlt&quot;</code> 
										</li>
										<li style="list-style-type: none">
											<code>&quot;Shift&quot;</code>, <code>&quot;LShift&quot;</code>, <code>&quot;RShift&quot;</code> 
										</li>
										<li style="list-style-type: none">
											<code>&quot;Ctrl&quot;</code>, <code>&quot;LCtrl&quot;</code>, <code>&quot;RCtrl&quot;</code> 
										</li>
										<li style="list-style-type: none">
											<code>&quot;IgnoreCase&quot;</code> - pseudo-qualifier; ignores the Shift key
										</li>
										<li style="list-style-type: none">
											<code>&quot;IgnoreAltShift&quot;</code> - pseudo-qualifier, ignores the Shift
											and Alt keys
										</li>
									</ul>
								</blockquote>
								<p>
									Alias names for keys are
								</p>
								<blockquote>
									<ul>
										<li style="list-style-type: none">
											<code>&quot;F1&quot;</code> ... <code>&quot;F12&quot;</code> (function keys),
										</li>
										<li style="list-style-type: none">
											<code>&quot;Left&quot;</code>, <code>&quot;Right&quot;</code>, <code>&quot;Up&quot;</code>, <code>&quot;Down&quot;</code> (cursor keys)
										</li>
										<li style="list-style-type: none">
											<code>&quot;BckSpc&quot;</code>, <code>&quot;Tab&quot;</code>, <code>&quot;Esc&quot;</code>, <code>&quot;Insert&quot;</code>,
											<code>&quot;Overwrite&quot;</code>, <code>&quot;PageUp&quot;</code>, <code>&quot;PageDown&quot;</code>, <code>&quot;Pos1&quot;</code>,
											<code>&quot;End&quot;</code>, <code>&quot;Print&quot;</code>, <code>&quot;Scroll&quot;</code>, and <code>&quot;Pause&quot;</code>}}.
										</li>
									</ul>
								</blockquote>
							</blockquote>
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>OVERRIDES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Object:addClassNotifications"><code>Object.addClassNotifications()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:cleanup"><code>Element:cleanup()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:getAttr"><code>Element:getAttr()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Class:new"><code>Class.new()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Widget:onClick"><code>Widget:onClick()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:passMsg"><code>Area:passMsg()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:setup"><code>Element:setup()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:show"><code>Area:show()</code></a> 
						</li>
					</ul>
				</blockquote>
				<hr class="page-break" />
			</div>
		</div>
		<div class="node"><h2><a name="tek.ui.class.poplist" id="tek.ui.class.poplist">PopList (v13.6)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> :
						<a href="#tek.class">Class</a> /
						<a href="#tek.class.object">Object</a> /
						<a href="#tek.ui.class.element">Element</a> /
						<a href="#tek.ui.class.area">Area</a> /
						<a href="#tek.ui.class.frame">Frame</a> /
						<a href="#tek.ui.class.widget">Widget</a> /
						<a href="#tek.ui.class.text">Text</a> /
						<a href="#tek.ui.class.popitem">PopItem</a> /
						PopList 
					</p>
					<p>
						This class is a specialization of a PopItem allowing the user
						to choose an item from a list.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>ATTRIBUTES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<code>ListObject &#091;IG&#093;</code> (<a href="#tek.class.list">List</a>)
							<blockquote>
								<p>
									List object
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>SelectedLine &#091;ISG&#093;</code> (number)
							<blockquote>
								<p>
									Number of the selected entry, or 0 if none is selected. Changing
									this attribute invokes the <a href="#PopList:onSelectLine"><code>PopList:onSelectLine()</code></a> method.
								</p>
							</blockquote>
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>IMPLEMENTS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#PopList:onSelectLine"><code>PopList:onSelectLine()</code></a> - Handler for the <code>SelectedLine</code> attribute
						</li>
						<li style="list-style-type: none">
							<a href="#PopList:setList"><code>PopList:setList()</code></a> - Sets a new list object
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>OVERRIDES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Area:askMinMax"><code>Area:askMinMax()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:cleanup"><code>Area:cleanup()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:draw"><code>Area:draw()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Class:new"><code>Class.new()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:setup"><code>Area:setup()</code></a> 
						</li>
					</ul>
				</blockquote>
				<hr />
			</div>
		</div>
		<div class="node"><h3><a name="PopList:onSelectLine" id="PopList:onSelectLine"><code>onSelectLine()</code></a></h3>
			<p>
				This method is invoked when the <code>SelectedLine</code> 
				attribute has changed.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="PopList:setList" id="PopList:setList"><code>setList(listobject)</code></a></h3>
			<p>
				Sets a new <a href="#tek.class.list">List</a> 
				object.
			</p>
			<hr class="page-break" />
		</div>
		<div class="node"><h2><a name="tek.ui.class.popupwindow" id="tek.ui.class.popupwindow">PopupWindow (v5.3)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> :
						<a href="#tek.class">Class</a> /
						<a href="#tek.class.object">Object</a> /
						<a href="#tek.ui.class.element">Element</a> /
						<a href="#tek.ui.class.area">Area</a> /
						<a href="#tek.ui.class.frame">Frame</a> /
						<a href="#tek.ui.class.widget">Widget</a> /
						<a href="#tek.ui.class.group">Group</a> /
						<a href="#tek.ui.class.group">Window</a> /
						PopupWindow 
					</p>
					<p>
						This class specializes a Window for the use by a
						<a href="#tek.ui.class.popitem">PopItem</a>.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>OVERRIDES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Class:new"><code>Class.new()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:passMsg"><code>Area:passMsg()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:show"><code>Area:show()</code></a> 
						</li>
					</ul>
				</blockquote>
				<hr class="page-break" />
			</div>
		</div>
		<div class="node"><h2><a name="tek.ui.class.radiobutton" id="tek.ui.class.radiobutton">RadioButton (v6.2)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> :
						<a href="#tek.class">Class</a> /
						<a href="#tek.class.object">Object</a> /
						<a href="#tek.ui.class.element">Element</a> /
						<a href="#tek.ui.class.area">Area</a> /
						<a href="#tek.ui.class.frame">Frame</a> /
						<a href="#tek.ui.class.widget">Widget</a> /
						<a href="#tek.ui.class.text">Text</a> /
						<a href="#tek.ui.class.checkmark">CheckMark</a> /
						RadioButton 
					</p>
					<p>
						Specialization of a <a href="#tek.ui.class.checkmark">CheckMark</a> to
						implement mutually exclusive 'radio buttons'.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>OVERRIDES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Class:new"><code>Class.new()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Widget:onSelect"><code>Widget:onSelect()</code></a> 
						</li>
					</ul>
				</blockquote>
				<hr class="page-break" />
			</div>
		</div>
		<div class="node"><h2><a name="tek.ui.class.scrollbar" id="tek.ui.class.scrollbar">ScrollBar (v15.4)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> :
						<a href="#tek.class">Class</a> /
						<a href="#tek.class.object">Object</a> /
						<a href="#tek.ui.class.element">Element</a> /
						<a href="#tek.ui.class.area">Area</a> /
						<a href="#tek.ui.class.frame">Frame</a> /
						<a href="#tek.ui.class.widget">Widget</a> /
						<a href="#tek.ui.class.group">Group</a> /
						ScrollBar 
					</p>
					<p>
						Implements a group containing a
						<a href="#tek.ui.class.slider">Slider</a> and arrow buttons.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>ATTRIBUTES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<code>AcceptFocus &#091;IG&#093;</code> (boolean)
							<blockquote>
								<p>
									If <strong>false</strong>, the elements inside the scrollbar (slider, arrows)
									abstain from receiving the input focus, which means that they can
									only be operated with the mouse. Default: <strong>true</strong> 
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Max &#091;ISG&#093;</code> (number)
							<blockquote>
								<p>
									The maximum value the slider can accept. Setting this value
									invokes the <a href="#ScrollBar:onSetMax"><code>ScrollBar:onSetMax()</code></a> method.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Min &#091;ISG&#093;</code> (number)
							<blockquote>
								<p>
									The minimum value the slider can accept. Setting this value
									invokes the <a href="#ScrollBar:onSetMin"><code>ScrollBar:onSetMin()</code></a> method.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Orientation &#091;IG&#093;</code> (string)
							<blockquote>
								<p>
									The orientation of the scrollbar, which can be &quot;horizontal&quot;
									or &quot;vertical&quot;
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Range &#091;ISG&#093;</code> (number)
							<blockquote>
								<p>
									The range of the slider, i.e. the size it represents. Setting
									this value invokes the <a href="#ScrollBar:onSetRange"><code>ScrollBar:onSetRange()</code></a> method.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Step &#091;IG&#093;</code> (boolean or number)
							<blockquote>
								<p>
									See <a href="#tek.ui.class.slider">tek.ui.class.slider</a>.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Value &#091;ISG&#093;</code> (number)
							<blockquote>
								<p>
									The value of the slider. Setting this value invokes the
									<a href="#ScrollBar:onSetValue"><code>ScrollBar:onSetValue()</code></a> method.
								</p>
							</blockquote>
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>IMPLEMENTS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#ScrollBar:onSetMax"><code>ScrollBar:onSetMax()</code></a> - Handler for the <code>Max</code> attribute
						</li>
						<li style="list-style-type: none">
							<a href="#ScrollBar:onSetMin"><code>ScrollBar:onSetMin()</code></a> - Handler for the <code>Min</code> attribute
						</li>
						<li style="list-style-type: none">
							<a href="#ScrollBar:onSetRange"><code>ScrollBar:onSetRange()</code></a> - Handler for the <code>Range</code> attribute
						</li>
						<li style="list-style-type: none">
							<a href="#ScrollBar:onSetValue"><code>ScrollBar:onSetValue()</code></a> - Handler for the <code>Value</code> attribute
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>OVERRIDES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Object:addClassNotifications"><code>Object.addClassNotifications()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:cleanup"><code>Element:cleanup()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Class:new"><code>Class.new()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:setup"><code>Element:setup()</code></a> 
						</li>
					</ul>
				</blockquote>
				<hr />
			</div>
		</div>
		<div class="node"><h3><a name="ScrollBar:onSetMax" id="ScrollBar:onSetMax"><code>onSetMax()</code></a></h3>
			<p>
				This handler is invoked when the ScrollBar's <code>Max</code> 
				attribute has changed. See also <a href="#Numeric:onSetMax"><code>Numeric:onSetMax()</code></a>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="ScrollBar:onSetMin" id="ScrollBar:onSetMin"><code>onSetMin()</code></a></h3>
			<p>
				This handler is invoked when the ScrollBar's <code>Min</code> 
				attribute has changed. See also <a href="#Numeric:onSetMin"><code>Numeric:onSetMin()</code></a>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="ScrollBar:onSetRange" id="ScrollBar:onSetRange"><code>onSetRange()</code></a></h3>
			<p>
				This handler is invoked when the ScrollBar's <code>Range</code> 
				attribute has changed. See also <a href="#Slider:onSetRange"><code>Slider:onSetRange()</code></a>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="ScrollBar:onSetValue" id="ScrollBar:onSetValue"><code>onSetValue()</code></a></h3>
			<p>
				This handler is invoked when the ScrollBar's <code>Value</code> 
				attribute has changed. See also <a href="#Numeric:onSetValue"><code>Numeric:onSetValue()</code></a>.
			</p>
			<hr class="page-break" />
		</div>
		<div class="node"><h2><a name="tek.ui.class.scrollgroup" id="tek.ui.class.scrollgroup">ScrollGroup (v19.3)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> :
						<a href="#tek.class">Class</a> /
						<a href="#tek.class.object">Object</a> /
						<a href="#tek.ui.class.element">Element</a> /
						<a href="#tek.ui.class.area">Area</a> /
						<a href="#tek.ui.class.frame">Frame</a> /
						<a href="#tek.ui.class.widget">Widget</a> /
						<a href="#tek.ui.class.group">Group</a> /
						ScrollGroup / <select onchange="if (this.value != '') window.location.href = this.value; this.selectedIndex = 0;"><option value="">1 subclasses</option><option value="#tek.ui.class.input">Input</option></select>
					</p>
					<p>
						This class implements a group containing a scrollable
						container and accompanying elements such as horizontal and vertical
						<a href="#tek.ui.class.scrollbar">ScrollBars</a>.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>ATTRIBUTES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<code>AcceptFocus &#091;IG&#093;</code> (boolean)
							<blockquote>
								<p>
									This attribute is passed to the scrollbar elements inside the
									scroll group. See <a href="#tek.ui.class.scrollbar">ScrollBar</a> 
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Child &#091;IG&#093;</code> (<a href="#tek.ui.class.canvas">Canvas</a>)
							<blockquote>
								<p>
									Specifies the Canvas which encapsulates the scrollable
									area and children.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>HSliderMode &#091;IG&#093;</code> (string)
							<blockquote>
								<p>
									Specifies when the horizontal
									<a href="#tek.ui.class.scrollbar">ScrollBar</a> should be visible:
								</p>
								<blockquote>
									<ul>
										<li style="list-style-type: none">
											<code>&quot;on&quot;</code> - The horizontal scrollbar is displayed
										</li>
										<li style="list-style-type: none">
											<code>&quot;off&quot;</code> - The horizontal scrollbar is not displayed
										</li>
										<li style="list-style-type: none">
											<code>&quot;auto&quot;</code> - The horizontal scrollbar is displayed when
											the Lister is wider than the currently visible area.
										</li>
									</ul>
								</blockquote>
								<p>
									Note: The use of the <code>&quot;auto&quot;</code> mode is currently (v8.0)
									discouraged.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>VSliderMode &#091;IG&#093;</code> (string)
							<blockquote>
								<p>
									Specifies when the vertical
									<a href="#tek.ui.class.scrollbar">ScrollBar</a> should be visible:
								</p>
								<blockquote>
									<ul>
										<li style="list-style-type: none">
											<code>&quot;on&quot;</code> - The vertical scrollbar is displayed
										</li>
										<li style="list-style-type: none">
											<code>&quot;off&quot;</code> - The vertical scrollbar is not displayed
										</li>
										<li style="list-style-type: none">
											<code>&quot;auto&quot;</code> - The vertical scrollbar is displayed when
											the Lister is taller than the currently visible area.
										</li>
									</ul>
								</blockquote>
								<p>
									Note: The use of the <code>&quot;auto&quot;</code> mode is currently (v8.0)
									discouraged.
								</p>
							</blockquote>
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>OVERRIDES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Element:cleanup"><code>Element:cleanup()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:layout"><code>Area:layout()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Class:new"><code>Class.new()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:setup"><code>Element:setup()</code></a> 
						</li>
					</ul>
				</blockquote>
				<hr class="page-break" />
			</div>
		</div>
		<div class="node"><h2><a name="tek.ui.class.sizeable" id="tek.ui.class.sizeable">Sizeable (v11.4)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> :
						<a href="#tek.class">Class</a> /
						<a href="#tek.class.object">Object</a> /
						<a href="#tek.ui.class.element">Element</a> /
						<a href="#tek.ui.class.area">Area</a> /
						<a href="#tek.ui.class.frame">Frame</a> /
						<a href="#tek.ui.class.widget">Widget</a> /
						Sizeable / <select onchange="if (this.value != '') window.location.href = this.value; this.selectedIndex = 0;"><option value="">1 subclasses</option><option value="#tek.ui.class.textedit">TextEdit</option></select>
					</p>
					<p>
						This class implements the ability to resize an element without the
						need to repaint it completely. Its parent must be a Canvas element.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>IMPLEMENTS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Sizeable:resize"><code>Sizeable:resize()</code></a> - Resize the element
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>OVERRIDES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Element:connect"><code>Element:connect()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:draw"><code>Area:draw()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:layout"><code>Area:layout()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Class:new"><code>Class.new()</code></a> 
						</li>
					</ul>
				</blockquote>
				<hr />
			</div>
		</div>
		<div class="node"><h3><a name="Sizeable:resize" id="Sizeable:resize"><code>Sizeable:resize(dx, dy, insx, insy)</code></a></h3>
			<p>
				Resize the element by <code>dx</code> on the
				x axis and <code>dy</code> on the y axis, inserting or removing space at <code>insx</code> 
				on the x axis and <code>insy</code> on the y axis.
			</p>
			<hr class="page-break" />
		</div>
		<div class="node"><h2><a name="tek.ui.class.slider" id="tek.ui.class.slider">Slider (v27.1)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> :
						<a href="#tek.class">Class</a> /
						<a href="#tek.class.object">Object</a> /
						<a href="#tek.ui.class.element">Element</a> /
						<a href="#tek.ui.class.area">Area</a> /
						<a href="#tek.ui.class.frame">Frame</a> /
						<a href="#tek.ui.class.widget">Widget</a> /
						<a href="#tek.ui.class.numeric">Numeric</a> /
						Slider 
					</p>
					<p>
						This class implements a slider for adjusting a numerical value.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>ATTRIBUTES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<code>AutoCapture &#091;ISG&#093;</code> (boolean)
							<blockquote>
								<p>
									If <strong>true</strong> and the slider is receiving the focus, it reacts
									on keyboard shortcuts instantly; otherwise, it must be selected
									first (and deselected afterwards). Default: <strong>true</strong> 
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Child &#091;IG&#093;</code> (<a href="#tek.ui.class.widget">Widget</a>)
							<blockquote>
								<p>
									A Widget object for being used as the slider's knob. By default,
									a knob widget of the style class <code>&quot;knob&quot;</code> is created internally.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Kind &#091;IG&#093;</code> (string)
							<blockquote>
								<p>
									Kind of the slider:
								</p>
								<blockquote>
									<ul>
										<li style="list-style-type: none">
											<code>&quot;scrollbar&quot;</code> - for scrollbars. Sets the additional
											style class <code>&quot;knob-scrollbar&quot;</code>.
										</li>
										<li style="list-style-type: none">
											<code>&quot;number&quot;</code> - for adjusting numbers. Sets the additional
											style class <code>&quot;knob-number&quot;</code>.
										</li>
									</ul>
								</blockquote>
								<p>
									Default: <strong>false</strong>, the kind is unspecified.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Orientation &#091;IG&#093;</code> (string)
							<blockquote>
								<p>
									Orientation of the slider, which can be <code>&quot;horizontal&quot;</code> or
									<code>&quot;vertical&quot;</code>. Default: <code>&quot;horizontal&quot;</code> 
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Range &#091;ISG&#093;</code> (number)
							<blockquote>
								<p>
									The size of the slider, i.e. the range that it represents.
									Setting this value invokes the <a href="#Slider:onSetRange"><code>Slider:onSetRange()</code></a> method.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Step &#091;ISG&#093;</code> (boolean or number)
							<blockquote>
								<p>
									If <strong>true</strong> or <code>1</code>, integer steps are enforced. If a number,
									steps of that size are enforced. If <strong>false</strong>, the default, the
									slider knob moves continuously.
								</p>
							</blockquote>
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>IMPLEMENTS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Slider:onSetRange"><code>Slider:onSetRange()</code></a> - Handler for the <code>Range</code> attribute
						</li>
					</ul>
				</blockquote>
				<p>
					OVERRIDES:
				</p>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Object:addClassNotifications"><code>Object.addClassNotifications()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:cleanup"><code>Element:cleanup()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:draw"><code>Area:draw()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:hide"><code>Area:hide()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:layout"><code>Area:layout()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Class:new"><code>Class.new()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Widget:onFocus"><code>Widget:onFocus()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Widget:onHold"><code>Widget:onHold()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:passMsg"><code>Area:passMsg()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:setState"><code>Area:setState()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:setup"><code>Element:setup()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:show"><code>Area:show()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Numeric:onSetMax"><code>Numeric:onSetMax()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Numeric:onSetValue"><code>Numeric:onSetValue()</code></a> 
						</li>
					</ul>
				</blockquote>
				<hr />
			</div>
		</div>
		<div class="node"><h3><a name="Slider:onSetRange" id="Slider:onSetRange"><code>Slider:onSetRange()</code></a></h3>
			<p>
				This handler is invoked when the <code>Range</code> 
				attribute has changed.
			</p>
			<hr class="page-break" />
		</div>
		<div class="node"><h2><a name="tek.ui.class.spacer" id="tek.ui.class.spacer">Spacer (v2.3)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> :
						<a href="#tek.class">Class</a> /
						<a href="#tek.class.object">Object</a> /
						<a href="#tek.ui.class.element">Element</a> /
						<a href="#tek.ui.class.area">Area</a> /
						<a href="#tek.ui.class.frame">Frame</a> /
						Spacer 
					</p>
					<p>
						This class implements a separator that helps to arrange elements in
						a group.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>OVERRIDES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Element:setup"><code>Element:setup()</code></a> 
						</li>
					</ul>
				</blockquote>
				<hr class="page-break" />
			</div>
		</div>
		<div class="node"><h2><a name="tek.ui.class.text" id="tek.ui.class.text">Text (v29.1)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> :
						<a href="#tek.class">Class</a> /
						<a href="#tek.class.object">Object</a> /
						<a href="#tek.ui.class.element">Element</a> /
						<a href="#tek.ui.class.area">Area</a> /
						<a href="#tek.ui.class.frame">Frame</a> /
						<a href="#tek.ui.class.widget">Widget</a> /
						Text / <select onchange="if (this.value != '') window.location.href = this.value; this.selectedIndex = 0;"><option value="">4 subclasses</option><option value="#tek.ui.class.button">Button</option><option value="#tek.ui.class.checkmark">CheckMark</option><option value="#tek.ui.class.lister">Lister</option><option value="#tek.ui.class.popitem">PopItem</option></select>
					</p>
					<p>
						This class implements widgets with text.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>ATTRIBUTES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<code>KeepMinHeight &#091;I&#093;</code> (boolean)
							<blockquote>
								<p>
									After the initial size calculation, keep the minimal height of
									the element and do not rethink the layout in response to a
									possible new minimal height (e.g. resulting from a newly set
									text). The boolean (default <strong>false</strong>) will be translated
									to the flag <code>FL_KEEPMINHEIGHT</code>, and is meaningless after
									initialization.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>KeepMinWidth &#091;I&#093;</code> (boolean)
							<blockquote>
								<p>
									Translates to the flag <code>FL_KEEPMINWIDTH</code>. See also
									<code>KeepMinHeight</code>, above.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Text &#091;ISG&#093;</code> (string)
							<blockquote>
								<p>
									The text that will be displayed on the element; it may span
									multiple lines (see also <a href="#Text:makeTextRecords"><code>Text:makeTextRecords()</code></a>). Setting this
									attribute invokes the <a href="#Text:onSetText"><code>Text:onSetText()</code></a> method.
								</p>
							</blockquote>
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>STYLE PROPERTIES</dfn>
				<blockquote>
					<table>
						<tr>
							<td class="column1">
								<em>color-disabled</em> 
							</td>
							<td class="column2">
								Secondary color for text in disabled state
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>font</em> 
							</td>
							<td class="column2">
								Font specification, see below
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>text-align</em> 
							</td>
							<td class="column2">
								<code>&quot;left&quot;</code>, <code>&quot;center&quot;</code>, <code>&quot;right&quot;</code> 
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>vertical-align</em> 
							</td>
							<td class="column2">
								<code>&quot;top&quot;</code>, <code>&quot;center&quot;</code>, <code>&quot;bottom&quot;</code> 
							</td>
						</tr>
					</table>
				</blockquote>
			</div>
			<div class="definition"><dfn>FONT SPECIFICATION</dfn>
				<blockquote>
					<p>
						A font is specified in the form
					</p>
<pre>
&quot;&#091;fontname1,fontname2,...&#093;&#091;:&#093;&#091;size&#093;&quot;
</pre>
					<p>
						Font names, if specified, will be probed in the order of their
						occurrence; the first font that can be opened will  be used. For
						the font name, the following predefined names are supported:
					</p>
					<blockquote>
						<ul>
							<li>
								<em>ui-main</em> (or an empty string) - The default font,
								e.g. for buttons
							</li>
							<li>
								<em>ui-fixed</em> - The default fixed font
							</li>
							<li>
								<em>ui-menu</em> - The default menu font
							</li>
							<li>
								<em>ui-small</em> - The default small font, e.g. for group
								captions
							</li>
							<li>
								<em>ui-x-small</em> - The default 'extra small' font
							</li>
							<li>
								<em>ui-xx-small</em> - The default 'extra extra small' font
							</li>
							<li>
								<em>ui-large</em> - The default 'large' font
							</li>
							<li>
								<em>ui-x-large</em> - The default 'extra large' font
							</li>
							<li>
								<em>ui-xx-large</em> - The default 'extra extra large' font
							</li>
						</ul>
					</blockquote>
					<p>
						If no font name is specified, the main font will be used.
						The size specification (in pixels) is optional; if absent,
						the respective font's default size will be used.
					</p>
					<p>
						Additional hints can be passed alongside with the fontname by appending
						a slash and option letters, which must be in alphabetical order.
						Currently, the letter <code>b</code> will be used as a hint for boldface, and
						<code>i</code> for italic. For example, the string <code>&quot;ui-main/bi&quot;</code> would
						request the default main font in bold italic.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>IMPLEMENTS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Text:getTextSize"><code>Text:getTextSize()</code></a> - Gets the total extents of all text records
						</li>
						<li style="list-style-type: none">
							<a href="#Text:makeTextRecords"><code>Text:makeTextRecords()</code></a> - Breaks text into multiple line records
						</li>
						<li style="list-style-type: none">
							<a href="#Text:onSetText"><code>Text:onSetText()</code></a> - Handler for changes of the <code>Text</code> attribute
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>OVERRIDES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Object:addClassNotifications"><code>Object.addClassNotifications()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:askMinMax"><code>Area:askMinMax()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:cleanup"><code>Element:cleanup()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:draw"><code>Area:draw()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Class:new"><code>Class.new()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:onSetStyle"><code>Element:onSetStyle()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:setup"><code>Element:setup()</code></a> 
						</li>
					</ul>
				</blockquote>
				<hr />
			</div>
		</div>
		<div class="node"><h3><a name="Text:getTextSize" id="Text:getTextSize"><code>width, height = getTextSize([textrecord])</code></a></h3>
			<p>
				This function calculates
				the total width and height required by the object's text records.
				Optionally, it can be passed a table of text records which are to be
				evaluated.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Text:makeTextRecords" id="Text:makeTextRecords"><code>makeTextRecords(text)</code></a></h3>
			<p>
				This function parses the given <code>text</code>, breaks it
				along the encountered newline characters into single-line records, and
				places the resulting table in the element's <code>TextRecords</code> field.
				Each record has the form
			</p>
<pre>
{ &#091;1&#093;=text, &#091;2&#093;=font, &#091;3&#093;=align-horizontal, &#091;4&#093;=align-vertical,
  &#091;5&#093;=margin-left, &#091;6&#093;=margin-right, &#091;7&#093;=margin-top,
  &#091;8&#093;=margin-bottom, &#091;9&#093;=font-height, &#091;10&#093;=text-width }
</pre>
			<p>
				More undocumented fields may follow at higher indices. <code>font</code> is taken
				from opening the font specified in the object's <code>Font</code> attribute,
				which also determines <code>font-height</code> and is used for calculating the
				<code>text-width</code> (in pixels). The alignment parameters are taken from the
				object's <code>TextHAlign</code> and <code>TextVAlign</code> attributes, respectively.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Text:onSetText" id="Text:onSetText"><code>onSetText()</code></a></h3>
			<p>
				This handler is invoked when the element's <code>Text</code> 
				attribute has changed.
			</p>
			<hr class="page-break" />
		</div>
		<div class="node"><h2><a name="tek.ui.class.textedit" id="tek.ui.class.textedit">TextEdit (v21.1)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> :
						<a href="#tek.class">Class</a> /
						<a href="#tek.class.object">Object</a> /
						<a href="#tek.ui.class.element">Element</a> /
						<a href="#tek.ui.class.area">Area</a> /
						<a href="#tek.ui.class.frame">Frame</a> /
						<a href="#tek.ui.class.widget">Widget</a> /
						<a href="#tek.ui.class.sizeable">Sizeable</a> /
						TextEdit 
					</p>
					<p>
						Text editor class
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>ATTRIBUTES</dfn>
			</div>
			<div class="definition"><dfn>STYLE PROPERTIES</dfn>
			</div>
			<div class="definition"><dfn>IMPLEMENTS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#TextEdit:addChar"><code>TextEdit:addChar()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#TextEdit:getText"><code>TextEdit:getText()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#TextEdit:remChar"><code>TextEdit:remChar()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#TextEdit:saveText"><code>TextEdit:saveText()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#TextEdit:setEditing"><code>TextEdit:setEditing()</code></a> 
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>OVERRIDES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Element:cleanup"><code>Element:cleanup()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:draw"><code>Area:draw()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:layout"><code>Area:layout()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Class:new"><code>Class.new()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:onSetStyle"><code>Element:onSetStyle()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:setState"><code>Area:setState()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:setup"><code>Element:setup()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:show"><code>Area:show()</code></a> 
						</li>
					</ul>
				</blockquote>
				<hr />
			</div>
		</div>
		<div class="node"><h3><a name="TextEdit:addChar" id="TextEdit:addChar"><code>added = addChar(utf8)</code></a></h3>
			<p>
				Adds an utf8 character to the text. By adding a
				newline (<code>&quot;\n&quot;</code>) or CR (<code>&quot;\r&quot;</code>), a new line is produced, <code>&quot;\127&quot;</code> 
				(DEL) deletes the character under the cursor, <code>&quot;\008&quot;</code> performs a
				backspace.
			</p>
			<hr class="page-break" />
		</div>
		<div class="node"><h2><a name="tek.ui.class.widget" id="tek.ui.class.widget">Widget (v31.1)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> :
						<a href="#tek.class">Class</a> /
						<a href="#tek.class.object">Object</a> /
						<a href="#tek.ui.class.element">Element</a> /
						<a href="#tek.ui.class.area">Area</a> /
						<a href="#tek.ui.class.frame">Frame</a> /
						Widget / <select onchange="if (this.value != '') window.location.href = this.value; this.selectedIndex = 0;"><option value="">6 subclasses</option><option value="#tek.ui.class.group">Group</option><option value="#tek.ui.class.handle">Handle</option><option value="#tek.ui.class.imagewidget">ImageWidget</option><option value="#tek.ui.class.numeric">Numeric</option><option value="#tek.ui.class.sizeable">Sizeable</option><option value="#tek.ui.class.text">Text</option></select>
					</p>
					<p>
						This class implements interactions with the user.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>ATTRIBUTES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<code>Active &#091;SG&#093;</code> (boolean)
							<blockquote>
								<p>
									The Widget's activation state. While <strong>true</strong>, the position of
									the pointing device is being verified (which is also reflected by
									the <code>Hilite</code> attribute, see below). When the <code>Active</code> state
									variable changes, the Widget's behavior depends on its <code>Mode</code> 
									attribute (see below):
								</p>
								<blockquote>
									<ul>
										<li>
											in <em>button</em> mode, the <code>Selected</code> attribute is set to
											the value of the <code>Hilite</code> attribute. When the <code>Selected</code> 
											state changes, the <code>Pressed</code> attribute is set to the value
											of the <code>Active</code> attribute.
										</li>
										<li>
											in <em>toggle</em> mode, the <code>Selected</code> attribute is inverted
											logically, and the <code>Pressed</code> attribute is set to <strong>true</strong>.
										</li>
										<li>
											in <em>touch</em> mode, the <code>Selected</code> and <code>Pressed</code> 
											attributes are set to <strong>true</strong>, if the Widget was not
											selected already.
										</li>
									</ul>
								</blockquote>
								<p>
									Changing this attribute invokes the <a href="#Widget:onActivate"><code>Widget:onActivate()</code></a> method.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>DblClick &#091;SG&#093;</code> (boolean)
							<blockquote>
								<p>
									Signifies that the element is or has been double-clicked; it is
									set to <strong>true</strong> when the element was double-clicked and is still
									being held, and <strong>false</strong> when the second press has been
									released. Changes to this attribute cause the invocation of the
									<a href="#Widget:onDblClick"><code>Widget:onDblClick()</code></a> method.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>FGPen &#091;IG&#093;</code> (color specification)
							<blockquote>
								<p>
									A color specification for rendering the foreground details of the
									element. This attribute is controllable via the <em>color</em> style
									property.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Hold &#091;SG&#093;</code> (boolean)
							<blockquote>
								<p>
									Signifies that the element is being pressed for an extended period.
									While being held, the value is repeatedly set to <strong>true</strong> in
									intervals of <code>n/50</code> seconds, with <code>n</code> taken from the
									<a href="#tek.ui.class.window">Window</a>'s <code>HoldTickRepeat</code> attribute.
									When the element is released, this attribute is set to <strong>false</strong>.
									Changes to this attribute cause the invocation of the
									<a href="#Widget:onHold"><code>Widget:onHold()</code></a> method.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>InitialFocus &#091;I&#093;</code> (boolean)
							<blockquote>
								<p>
									Specifies that the element should receive the focus initially.
									If <strong>true</strong>, the element will set its <code>Focus</code> attribute to
									<strong>true</strong> upon invocation of the <a href="#Area:show">show</a> method.
									The boolean will be translated to the flag <code>FL_INITIALFOCUS</code>,
									and is meaningless after initialization.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>KeyCode &#091;IG&#093;</code> (string or boolean)
							<blockquote>
								<p>
									If set, a keyboard equivalent for activating the element. See
									<a href="#tek.ui.class.popitem">PopItem</a> for a discussion of denoting
									keyboard qualifiers. The <a href="#tek.ui.class.text">Text</a> class allows
									setting this attribute to <strong>true</strong>, in which case the element's
									<code>Text</code> will be examined during setup for an initiatory character
									(by default an underscore), and if found, the <code>KeyCode</code> attribute
									will be replaced by the character following this marker.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Mode &#091;ISG&#093;</code> (string)
							<blockquote>
								<p>
									The element's interaction mode:
								</p>
								<blockquote>
									<ul>
										<li>
											<code>&quot;inert&quot;</code>: The element does not react on input
										</li>
										<li>
											<code>&quot;touch&quot;</code>: The element does not rebound and keeps its
											<code>Selected</code> state; it cannot be unselected by the user and
											always submits <strong>true</strong> for the <code>Pressed</code> and <code>Selected</code> 
											attributes.
										</li>
										<li>
											<code>&quot;toggle&quot;</code>: The element does not rebound immediately
											and keeps its <code>Selected</code> state until the next activation.
										</li>
										<li>
											<code>&quot;button&quot;</code>: The element rebounds when the pointing device
											over it is being released, or when it is no longer hovering it.
										</li>
									</ul>
								</blockquote>
								<p>
									See also the <code>Active</code> attribute.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Pressed &#091;SG&#093;</code> (boolean)
							<blockquote>
								<p>
									Signifies that a button was pressed or released. Changes to this
									state variable invoke <a href="#Widget:onPress"><code>Widget:onPress()</code></a>.
								</p>
							</blockquote>
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>STYLE PROPERTIES</dfn>
				<blockquote>
					<table>
						<tr>
							<td class="column1">
								<em>color</em> 
							</td>
							<td class="column2">
								controls the <code>Widget.FGPen</code> attribute
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>effect-class</em> 
							</td>
							<td class="column2">
								name of an class for rendering an overlay effect
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>effect-color</em> 
							</td>
							<td class="column2">
								controls the <em>ripple</em> effect hook
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>effect-color2</em> 
							</td>
							<td class="column2">
								controls the <em>ripple</em> effect hook
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>effect-kind</em> 
							</td>
							<td class="column2">
								controls the <em>ripple</em> effect hook
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>effect-maxnum</em> 
							</td>
							<td class="column2">
								controls the <em>ripple</em> effect hook
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>effect-maxnum2</em> 
							</td>
							<td class="column2">
								controls the <em>ripple</em> effect hook
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>effect-orientation</em> 
							</td>
							<td class="column2">
								controls the <em>ripple</em> effect hook
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>effect-padding</em> 
							</td>
							<td class="column2">
								controls the <em>ripple</em> effect hook
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>effect-ratio</em> 
							</td>
							<td class="column2">
								controls the <em>ripple</em> effect hook
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>effect-ratio2</em> 
							</td>
							<td class="column2">
								controls the <em>ripple</em> effect hook
							</td>
						</tr>
					</table>
					<p>
						A possible name for the <em>effect-class</em> property is <code>&quot;ripple&quot;</code>.
						As its name suggests, it can paint various ripple effects (e.g. for
						slider knobs and bar handles). Effect hooks are loaded from
						<code>tek.ui.hook</code> and may define their own style properties.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>STYLE PSEUDO CLASSES</dfn>
				<blockquote>
					<table>
						<tr>
							<td class="column1">
								<em>active</em> 
							</td>
							<td class="column2">
								for elements in active state
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>disabled</em> 
							</td>
							<td class="column2">
								for elements in disabled state
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>focus</em> 
							</td>
							<td class="column2">
								for elements that have the input focus
							</td>
						</tr>
						<tr>
							<td class="column1">
								<em>hover</em> 
							</td>
							<td class="column2">
								for elements that are being hovered by the mouse
							</td>
						</tr>
					</table>
				</blockquote>
			</div>
			<div class="definition"><dfn>IMPLEMENTS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Widget:activate"><code>Widget:activate()</code></a> - Activate this or neighbour element
						</li>
						<li style="list-style-type: none">
							<a href="#Widget:onActivate"><code>Widget:onActivate()</code></a> - Handler for <code>Active</code> 
						</li>
						<li style="list-style-type: none">
							<a href="#Widget:onClick"><code>Widget:onClick()</code></a> - Gets called when the element has been clicked
						</li>
						<li style="list-style-type: none">
							<a href="#Widget:onDblClick"><code>Widget:onDblClick()</code></a> - Handler for <code>DblClick</code> 
						</li>
						<li style="list-style-type: none">
							<a href="#Widget:onDisable"><code>Widget:onDisable()</code></a> - Handler for <code>Disabled</code> 
						</li>
						<li style="list-style-type: none">
							<a href="#Widget:onFocus"><code>Widget:onFocus()</code></a> - Handler for <code>Focus</code> 
						</li>
						<li style="list-style-type: none">
							<a href="#Widget:onHilite"><code>Widget:onHilite()</code></a> - Handler for <code>Hilite</code> 
						</li>
						<li style="list-style-type: none">
							<a href="#Widget:onHold"><code>Widget:onHold()</code></a> - Handler for <code>Hold</code> 
						</li>
						<li style="list-style-type: none">
							<a href="#Widget:onPress"><code>Widget:onPress()</code></a> - Handler for <code>Pressed</code> 
						</li>
						<li style="list-style-type: none">
							<a href="#Widget:onSelect"><code>Widget:onSelect()</code></a> - Handler for <code>Selected</code> 
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>OVERRIDES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Object:addClassNotifications"><code>Object.addClassNotifications()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:checkFocus"><code>Area:checkFocus()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:checkHilite"><code>Area:checkHilite()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:cleanup"><code>Element:cleanup()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:getPseudoClass"><code>Element:getPseudoClass()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Object:init"><code>Object.init()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:layout"><code>Area:layout()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:passMsg"><code>Area:passMsg()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:setState"><code>Area:setState()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:setup"><code>Element:setup()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:show"><code>Area:show()</code></a> 
						</li>
					</ul>
				</blockquote>
				<hr />
			</div>
		</div>
		<div class="node"><h3><a name="Widget:activate" id="Widget:activate"><code>Widget:activate([mode])</code></a></h3>
			<p>
				Activates this or an element's &quot;next&quot; element.
				<code>mode</code> can be <code>&quot;focus&quot;</code> (the default), <code>&quot;next&quot;</code>, or <code>&quot;click&quot;</code>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Widget:onActivate" id="Widget:onActivate"><code>Widget:onActivate()</code></a></h3>
			<p>
				This method is invoked when the <code>Active</code> 
				attribute has changed.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Widget:onClick" id="Widget:onClick"><code>Widget:onClick()</code></a></h3>
			<p>
				This method is called when the <code>Pressed</code> attribute
				changes from <strong>true</strong> to <strong>false</strong>, indicating that the pointing
				device has been released over the element.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Widget:onDblClick" id="Widget:onDblClick"><code>Widget:onDblClick()</code></a></h3>
			<p>
				This method is invoked when the <code>DblClick</code> 
				attribute has changed. It is <strong>true</strong> when the double click was
				initiated and the mouse button is still held, and <strong>false</strong> when it has
				been released.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Widget:onDisable" id="Widget:onDisable"><code>Widget:onDisable()</code></a></h3>
			<p>
				This method is invoked when the <code>Disabled</code> 
				attribute has changed. The <code>Disabled</code> attribute is defined in the
				<a href="#tek.ui.class.area">Area</a> class.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Widget:onFocus" id="Widget:onFocus"><code>Widget:onFocus()</code></a></h3>
			<p>
				This method is invoked when the <code>Focus</code> 
				attribute has changed. The <code>Focus</code> attribute is defined in the
				<a href="#tek.ui.class.area">Area</a> class.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Widget:onHilite" id="Widget:onHilite"><code>Widget:onHilite()</code></a></h3>
			<p>
				This handler is called when the <code>Hilite</code> 
				attribute has changed. The <code>Hilite</code> attribute is defined in the
				<a href="#tek.ui.class.area">Area</a> class.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Widget:onHold" id="Widget:onHold"><code>Widget:onHold()</code></a></h3>
			<p>
				This method is invoked when the <code>Hold</code> attribute
				has changed.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Widget:onPress" id="Widget:onPress"><code>Widget:onPress()</code></a></h3>
			<p>
				This handler is called when the <code>Pressed</code> 
				attribute has changed.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Widget:onSelect" id="Widget:onSelect"><code>Widget:onSelect()</code></a></h3>
			<p>
				This method is invoked when the <code>Selected</code> 
				attribute has changed. The <code>Selected</code> attribute is defined in the
				<a href="#tek.ui.class.area">Area</a> class.
			</p>
			<hr class="page-break" />
		</div>
		<div class="node"><h2><a name="tek.ui.class.window" id="tek.ui.class.window">Window (v46.5)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> :
						<a href="#tek.class">Class</a> /
						<a href="#tek.class.object">Object</a> /
						<a href="#tek.ui.class.element">Element</a> /
						<a href="#tek.ui.class.area">Area</a> /
						<a href="#tek.ui.class.frame">Frame</a> /
						<a href="#tek.ui.class.widget">Widget</a> /
						<a href="#tek.ui.class.group">Group</a> /
						Window / <select onchange="if (this.value != '') window.location.href = this.value; this.selectedIndex = 0;"><option value="">1 subclasses</option><option value="#tek.ui.class.popupwindow">PopupWindow</option></select>
					</p>
					<p>
						This class implements a <a href="#tek.ui.class.group">Group</a> which
						fills up a window on the <a href="#tek.ui.class.display">Display</a>.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>ATTRIBUTES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<code>Center &#091;IG&#093;</code> (boolean)
							<blockquote>
								<p>
									Instructs the Window to open centered.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>DblClickJitter &#091;IG&#093;</code> (number)
							<blockquote>
								<p>
									Maximum sum of squared pixel deltas (dx&#178; + dy&#178;) between
									mouse positions to be tolerated for a double click.
									The default is 70. Large touchscreens require a much larger value.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>DblClickTimeout &#091;IG&#093;</code> (number)
							<blockquote>
								<p>
									Maximum number of microseconds between events to be recognized as
									a double click. Default: 32000. Use a larger value for
									touchscreens.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>FullScreen &#091;IG&#093;</code> (boolean)
							<blockquote>
								<p>
									Instructs the Window to open borderless and in fullscreen mode.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>HideOnEscape &#091;IG&#093;</code> (boolean)
							<blockquote>
								<p>
									Instructs the window to invoke the <a href="#Window:onHide"><code>Window:onHide()</code></a> method
									when the Escape key is pressed. Default: <strong>false</strong> 
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Left &#091;IG&#093;</code> (number)
							<blockquote>
								<p>
									The window's left offset on the display, in pixels
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Modal &#091;IG&#093;</code> (boolean)
							<blockquote>
								<p>
									Instructs all other windows to reject input while this window is
									open.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>MouseX &#091;G&#093;</code> (number)
						</li>
						<li style="list-style-type: none">
							<code>MouseY &#091;G&#093;</code> (number)
							<blockquote>
								<p>
									The current window coordinates of the pointing device.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>RootWindow &#091;IG&#093;</code> (boolean)
							<blockquote>
								<p>
									Hint that the window can be used as the background or main window
									that determines the size of the screen or display resolution.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Status &#091;ISG&#093;</code> (string)
							<blockquote>
								<p>
									Status of the Window, which can be:
								</p>
								<blockquote>
									<ul>
										<li style="list-style-type: none">
											<code>&quot;initializing&quot;</code> - The window is initializing
										</li>
										<li style="list-style-type: none">
											<code>&quot;hide&quot;</code> - The window is hidden or about to hide;
											if you initialize the Window with this value, it will be
											created in hidden state.
										</li>
										<li style="list-style-type: none">
											<code>&quot;opening&quot;</code> - The window is about to open.
										</li>
										<li style="list-style-type: none">
											<code>&quot;show&quot;</code> - The window is shown.
										</li>
										<li style="list-style-type: none">
											<code>&quot;closing&quot;</code> - The Window is about to hide.
										</li>
									</ul>
								</blockquote>
								<p>
									Changing this attribute invokes the <a href="#Window:onChangeStatus"><code>Window:onChangeStatus()</code></a> 
									method.
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Title &#091;IG&#093;</code> (string)
							<blockquote>
								<p>
									The window's title
								</p>
							</blockquote>
						</li>
						<li style="list-style-type: none">
							<code>Top &#091;IG&#093;</code> (number)
							<blockquote>
								<p>
									The window's top offset on the display, in pixels
								</p>
							</blockquote>
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>IMPLEMENTS</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Window:addInputHandler"><code>Window:addInputHandler()</code></a> - Adds an input handler to the window
						</li>
						<li style="list-style-type: none">
							<a href="#Window:addInterval"><code>Window:addInterval()</code></a> - Adds an interval timer to the window
						</li>
						<li style="list-style-type: none">
							<a href="#Window:checkDblClickTime"><code>Window:checkDblClickTime()</code></a> - Checks a time for a doubleclick event
						</li>
						<li style="list-style-type: none">
							<a href="#Window:clickElement"><code>Window:clickElement()</code></a> - Simulates a click on an element
						</li>
						<li style="list-style-type: none">
							<a href="#Window:onChangeStatus"><code>Window:onChangeStatus()</code></a> - Handler for <code>Status</code> 
						</li>
						<li style="list-style-type: none">
							<a href="#Window:onHide"><code>Window:onHide()</code></a> - Handler for when the window is about to be closed
						</li>
						<li style="list-style-type: none">
							<a href="#Window:postMsg"><code>Window:postMsg()</code></a> - Post an user message in the Window's message queue
						</li>
						<li style="list-style-type: none">
							<a href="#Window:remInputHandler"><code>Window:remInputHandler()</code></a> - Removes an input handler from the window
						</li>
						<li style="list-style-type: none">
							<a href="#Window:remInterval"><code>Window:remInterval()</code></a> - Removes an interval timer from the window
						</li>
						<li style="list-style-type: none">
							<a href="#Window:setActiveElement"><code>Window:setActiveElement()</code></a> - Sets the window's active element
						</li>
						<li style="list-style-type: none">
							<a href="#Window:setDblClickElement"><code>Window:setDblClickElement()</code></a> - Sets the window's doubleclick element
						</li>
						<li style="list-style-type: none">
							<a href="#Window:setFocusElement"><code>Window:setFocusElement()</code></a> - Sets the window's focused element
						</li>
						<li style="list-style-type: none">
							<a href="#Window:setHiliteElement"><code>Window:setHiliteElement()</code></a> - Sets the window's hover element
						</li>
						<li style="list-style-type: none">
							<a href="#Window:setMovingElement"><code>Window:setMovingElement()</code></a> - Sets the window's moving element
						</li>
					</ul>
				</blockquote>
			</div>
			<div class="definition"><dfn>OVERRIDES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Object:addClassNotifications"><code>Object.addClassNotifications()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:hide"><code>Area:hide()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:layout"><code>Area:layout()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Class:new"><code>Class.new()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:passMsg"><code>Area:passMsg()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Element:setup"><code>Element:setup()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Area:show"><code>Area:show()</code></a> 
						</li>
					</ul>
				</blockquote>
				<hr />
			</div>
		</div>
		<div class="node"><h3><a name="Window:addInputHandler" id="Window:addInputHandler"><code>addInputHandler(msgtype, object, function)</code></a></h3>
			<p>
				Adds an <code>object</code> and
				a <code>function</code> to the window's chain of handlers for input of the
				specified type. Multiple input types can be handled by one handler by
				logically or'ing message types. Input handlers are invoked as follows:
			</p>
<pre>
message = function(object, message)
</pre>
			<p>
				The handler is expected to return the message, which will in turn pass
				it on to the next handler in the window's chain.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Window:addInterval" id="Window:addInterval"><code>addInterval()</code></a></h3>
			<p>
				Adds an interval timer to the window, which will
				furtheron generate MSG_INTERVAL messages 50 times per second. These
				messages cause a considerable load to the application, therefore each call
				to this function should be paired with a matching call to
				<a href="#Window:remInterval"><code>Window:remInterval()</code></a>, which will cause the interval timer to stop when
				no clients are needing it anymore.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Window:checkDblClickTime" id="Window:checkDblClickTime"><code>dblclick = checkDblClickTime(as, au, bs, bu)</code></a></h3>
			<p>
				Check if the two
				given times (first a, second b) are within the doubleclick interval.
				Each time is specified in seconds (<code>s</code>) and microseconds (<code>u</code>).
				Returns <strong>true</strong> if the two times are indicative of a double click.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Window:clickElement" id="Window:clickElement"><code>clickElement(element)</code></a></h3>
			<p>
				This function performs a simulated click on
				the specified <code>element</code>; if <code>element</code> is a string, it will be looked up
				using <a href="#Application:getById"><code>Application:getById()</code></a>. This function is actually a shorthand
				for <a href="#Window:setHiliteElement"><code>Window:setHiliteElement()</code></a>, followed by <a href="#Window:setActiveElement"><code>Window:setActiveElement()</code></a> twice
				(first to enable, then to disable it).
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Window:onChangeStatus" id="Window:onChangeStatus"><code>onChangeStatus()</code></a></h3>
			<p>
				This method is invoked when the Window's <code>Status</code> has
				changed.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Window:onHide" id="Window:onHide"><code>onHide()</code></a></h3>
			<p>
				This handler is invoked when the window's close button
				is clicked (or the Escape key is pressed and the <code>HideOnEscape</code> flag
				is set). The Window class' implementation of this handler is to hide
				the window by setting the <code>Status</code> attribute to <code>&quot;hide&quot;</code>. When the
				last window is closed, the application is closed down.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Window:postMsg" id="Window:postMsg"><code>postMsg(msg)</code></a></h3>
			<p>
				This function adds an user message to the Window's message
				queue.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Window:remInputHandler" id="Window:remInputHandler"><code>remInputHandler(msgtype, object, func)</code></a></h3>
			<p>
				Removes an input handler
				that was previously registered with the window using
				<a href="#Window:addInputHandler"><code>Window:addInputHandler()</code></a>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Window:remInterval" id="Window:remInterval"><code>remInterval()</code></a></h3>
			<p>
				Decreases the use counter for interval messages and
				stops sending interval messages to the window when called by the last
				client that has previously requested an interval timer using
				<a href="#Window:addInterval"><code>Window:addInterval()</code></a>.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Window:setActiveElement" id="Window:setActiveElement"><code>setActiveElement(element)</code></a></h3>
			<p>
				Sets/unsets the element which is
				currently active (or 'in use'). If <code>element</code> is <strong>nil</strong>, the currently
				active element will be deactivated.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Window:setDblClickElement" id="Window:setDblClickElement"><code>setDblClickElement(element)</code></a></h3>
			<p>
				Sets/unsets the element which is
				candidate for double click detection. If the element is set twice in a
				sufficiently short period of time and the pointing device did not move
				too much since the first event, the double click is triggered by
				notifying the <code>DblClick</code> attribute in the element. See also
				<a href="#tek.ui.class.widget">Widget</a> for further information.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Window:setFocusElement" id="Window:setFocusElement"><code>setFocusElement(element)</code></a></h3>
			<p>
				Sets/unsets the element which is marked
				for receiving the keyboard input.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Window:setHiliteElement" id="Window:setHiliteElement"><code>setHiliteElement(element)</code></a></h3>
			<p>
				Sets/unsets the element which is being
				hovered by the mouse pointer.
			</p>
			<hr />
		</div>
		<div class="node"><h3><a name="Window:setMovingElement" id="Window:setMovingElement"><code>setMovingElement(element)</code></a></h3>
			<p>
				Sets/unsets the element which is
				being moved around by the user.
			</p>
			<hr class="page-break" />
		</div>
		<div class="node"><h2><a name="tek.ui.layout.default" id="tek.ui.layout.default">DefaultLayout (v9.2)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> :
						<a href="#tek.class">Class</a> /
						<a href="#tek.ui.class.layout">Layout</a> /
						DefaultLayout
					</p>
					<p>
						This class implements a <a href="#tek.ui.class.group">Group</a>'s <em>default</em> 
						layouting strategy. The standard strategy is to adapt a Group's
						contents dynamically to the free space available. It takes into
						account an element's <code>HAlign</code>, <code>VAlign</code>, <code>Width</code>, and <code>Height</code> 
						attributes.
					</p>
				</blockquote>
			</div>
			<div class="definition"><dfn>OVERRIDES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Layout:askMinMax"><code>Layout:askMinMax()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Layout:layout"><code>Layout:layout()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Class:new"><code>Class.new()</code></a> 
						</li>
					</ul>
				</blockquote>
				<hr class="page-break" />
			</div>
		</div>
		<div class="node"><h2><a name="tek.ui.layout.fixed" id="tek.ui.layout.fixed">FixedLayout (v2.2)</a></h2>
			<div class="definition"><dfn>OVERVIEW</dfn>
				<blockquote>
					<p>
						<a href="#ClassOverview">ClassOverview</a> :
						<a href="#tek.class">Class</a> /
						<a href="#tek.ui.class.layout">Layout</a> /
						FixedLayout
					</p>
					<p>
						This class implements a <a href="#tek.ui.class.group">Group</a>'s <em>fixed</em> 
						layouting strategy. Using the fixed layouter, the size and position of
						individual elements in a group is predetermined by the contents of
						their <em>fixed</em> style property, with the coordinates of the rectangle
						in the order left, top, right, bottom, e.g.:
					</p>
<pre>
ui.Window:new {
  Layout = &quot;fixed&quot;, Width = 400, Height = 400,
  Children = {
    ui.Button:new {
      Style = &quot;fixed: 10 280 60 320&quot;
    }
  }
}
</pre>
				</blockquote>
			</div>
			<div class="definition"><dfn>OVERRIDES</dfn>
				<blockquote>
					<ul>
						<li style="list-style-type: none">
							<a href="#Layout:askMinMax"><code>Layout:askMinMax()</code></a> 
						</li>
						<li style="list-style-type: none">
							<a href="#Layout:layout"><code>Layout:layout()</code></a> 
						</li>
					</ul>
				</blockquote>
				<hr class="page-break" />
				<p>
					Document generated on Mon Sep 19 23:21:03 2016 using gendoc.lua version 1.7
				</p>
			</div>
		</div>
	</body>
</html>
